jQuery Load form elements through ajax, from onchange event of drop down box

问题

I have a dropdown and need to dynamical load form elements based on a statement

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

case 1 load some form elements (input etc..)
case 2 clear these elements ...

Thanks

回答1:

try this:

$(function() {

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

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

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

  });


});

回答2:

Following code gets the data via ajax call for OnChange Event and fills another 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);

            });
     });

I used getJSON to retrieve the data, you can use many more

回答3:

We may want to try this also

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

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

来源：https://stackoverflow.com/questions/4344747/jquery-load-form-elements-through-ajax-from-onchange-event-of-drop-down-box

标签

jquery

ajax

onchange