jQuery动态下拉框ajax

Question

我目前有两个下拉框和一个文本框。

我正在使用数据库查询来填充第一个下拉框和ajax以填充第二个下拉菜单，具体取决于在第一个下拉列表中选择的值。我也使用ajax填充输入文本框，一旦选择第二个下拉列表中的选择。

我的问题是，用我当前的代码，当我从第一个下拉列表中选择一个选项时，尽管它使用从ajax返回的数据填充第二个下拉框，但我也希望它也能够输入框并在第二个下拉值更新的同时返回该值。

 $("#manufacturerOpts").change(function(){ 
      val1 = $(this).attr("value"); 
      $.ajax({ 
       url: "inc/class/data.php", 
       type: "POST", 
       data: "manu="+val1, 
       cache: false, 
       success: function (html1) { 

       $('#modelOpts').html(html1); 

       val2 = $("#modelOpts option").attr("value"); 

       $.ajax({ 
       url: "inc/class/data.php", 
       type: "POST", 
       data: "mod="+val2, 
       cache: false, 
       success: function (html2) { 
       $('#powerOpts').html(html2);  
       } 
       }); 
       } 
       }); 

    }); 

    $("#modelOpts").change(function(){ 
      val1 = $(this).attr("value"); 
      $.ajax({ 
       url: "inc/class/data.php", 
       type: "POST", 
       data: "mod="+val1, 
       cache: false, 
       success: function (html1) { $('#powerOpts').attr("value",html1); } 
       }); 

      // $("#modelOpts").selectmenu('refresh', true); 
    }); 

Answer 1

您可以修改您的要求与下拉菜单选项

$.ajax({ 
    url: "inc/class/data.php", 
    type: "POST", 
    data: "manu="+val1, 
    dataType: 'json', 
    success: function (data) { 
     $('#modelOpts').html(data.modelOpts); 
     $('#powerOpts').html(data.powerOpts);  
    } 
}); 

，并在你的服务器端代码，你可以很容易找到的第一个选项的值一起发送值文本框为modelOpts下拉列表，并把它和

$data = array('modelOpts' => modelOptsHtml, 'powerOpts' => powerOptsHtml); 
echo json_encode($data);