jQueryドロップダウンボックスのonchangeイベントからajaxを介してフォーム要素をロードする

Question

私はドロップダウンを持っており、ステートメントに基づいてフォーム要素を動的にロードする必要があります

<select name="type" id="type"> 
    <option value="1">input</option> 
    <option value="2">text</option> 
</select> 

ケース1いくつかのフォーム要素を読み込みます（inoutなど..）
case 2これらの要素をクリアする ...

Answer 1

はこれを試してみてください。

次のコード0

Answer 2

はのOnChangeイベントのためのAJAX呼び出しを介してデータを取得し、私は、データを取得するためにgetJSONを使用

$("#IdOfyourDropDown").change(function() { 

     $.getJSON('<%= ResolveUrl("~/PutYourURL/?Id="1)%>', function (data) 
      { 
        Result = data; //Use this data for further creation of your elements. 
        var items = ""; 
        items += "<option value=0> -- </option>"; 
        $.each(data, function (i, SingleElement) { 
         items += "<option value='" + SingleElement.Value + "'>" + SingleElement.Text + "</option>"; 
        }); 
        $("#AnyOtherDropDown").html(items); 

      }); 
    }); 

別のドロップダウンを埋め、あなたは我々はまた、これを試してみたいことがあり、多くのmore

Answer 3

を使用することができますこれが正常に動作します

$("#type").change(function() { 
    $.post(
     "yourRequestHandlingPage.php", 
     { 
      param: $(this).val(); 
     }, 
     function(data) { 
      //supposing data holds the html output of dynamically creawted form element 
      $(".myformcontent").append(data); //add the elements at the end of the form elemetn 
     } 
}); 

Answer 4

<script type="text/javascript"> 
    $(document).ready(function(){ 
    $('#CustomFields_21_1').val('<?php echo $_POST['secondform']; ?>') 
     $('#CustomFields_21_1').change(function() { 
     var options = ''; 
     if($(this).val() == 'a') { 
      options = '<option value="">-- Seleccione una versión --</option><option value="1">1</option><option value="2">2</option><option value="3">3</option>'; 
     } 
     else if ($(this).val() == 'b'){ 
      options = '<option value="4">4</option><option value="5">5</option>'; 
     } 
     else if ($(this).val() == 'c'){ 
      options = '<option value="6">6</option><option value="7">7</option><option value="8">8</option><option value="9">9</option>'; 
     } 
    $('#CustomFields_20_1').html(options); 
    }); 
}); 
</script>