jQuery Загрузка элементов формы через ajax, из события onchange выпадающего списка

Question

У меня выпадающий список, и мне нужно динамически загружать элементы формы на основе оператора

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

case 1 загрузить некоторые элементы формы (inout и т.д ..)
case 2 очистить эти элементы ...

Спасибо

Answer 1

попробуйте это:

$(function() {

  $('#type').bind('change', function(ev) {

     var value = $(this).val();

     $.ajax({
        ...
        data: {valueType: value, html: encodeURIComponent($("#addhtml").html())},
        ...
     });

  });


});

Answer 2

Следующий код получает данные посредством вызова ajax для события OnChange и заполняет еще один DropDown

    $("#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);

            });
     });

Я использовал getJSON для извлечения данных, вы можете использовать много больше

Answer 3

<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>

Answer 4

Мы можем попробовать это также

$("#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
        }
});