javascript - 在级联下拉列表中失败，但首先使用 jquery Ajax 可以正常工作

Question

我有一个下拉列表，列出了使用 PHP 和 jQuery Ajax 从数据库获取的数据。

1. 第一个下拉列表成功获取数据并将其填充到下拉列表中。

第一个下拉列表的 HTML :

$(document).ready(function () {         
        $(function() {   
            $.ajax({
                type: 'POST',
                url: 'getGroupzBase.php', 
                datatype: 'json',
                success: function(data) {
                // Call this function on success                
                    console.log(data);
                   var yourArray = JSON.parse(data);
                   console.log(yourArray);                                           
                    $.each(yourArray, function (index, yourArray) {                 
                        $('#builder_group').append($('<option/>', { 
                            value: yourArray.id,
                            text : yourArray.name, 
                        }));
}); 
},
error: function() {
    displayDialogBox('Error', err.toString());
}
});              
});

以及下拉标签 -

<select id="builder_group"></select>

1. 第二个下拉菜单不适用于第一个下拉菜单。我还必须对第二个下拉列表使用 jQuery Ajax。
   第二个下拉列表的 HTML :

     <script>
       $("#builder_group").change(function(){
           console.log("Hello 1");
           $('#Ivrmapping_groupZCode').find('option').remove().end(); //clear the city ddl
           var builder = $(this).find("option:selected").text();
           alert(builder);
           //do the ajax call
           $.ajax({
               url:'getGroupzCode.php'
               type:'GET',
               data:{city:builder},
               dataType:'json',
               cache:false,
           success: function(data) {
                       // Call this function on success                
                           console.log(data);
                          var yourArray = JSON.parse(data);
                          console.log(yourArray);                                           
                           $.each(yourArray, function (index, yourArray) {                 
                           );
       }); 
       },
       error: function() {
           displayDialogBox('Error', err.toString());
       }
       }); 
   
           }); 
   
       });
   </script>
   

以及下拉标签 -

<select name="Ivrmapping[groupZCode]" id="Ivrmapping_groupZCode">..
</select>

为什么第二个下拉列表不能与第一个下拉列表一起使用。 我们可以在一页中调用多个 jQuery Ajax 吗？

Answer 1

我认为括号有问题::试试这个:

$("#builder_group").change(function(){
        console.log("Hello 1");
        $('#Ivrmapping_groupZCode').find('option').remove().end(); //clear the city ddl
        var builder = $(this).find("option:selected").text();
        alert(builder);
        //do the ajax call
        $.ajax({
            url:'getGroupzCode.php'
            type:'GET',
            data:{city:builder},
            dataType:'json',
            cache:false,
        success: function(data) {
                    // Call this function on success                
                        console.log(data);
                       var yourArray = JSON.parse(data);
                       console.log(yourArray);                                           
                        $.each(yourArray, function (index, yourArray) {/* your plan*/});
    },
    error: function() {
        displayDialogBox('Error', err.toString());
    }
    }); 
    });

你应该使用firebug或chrome，这些错误会清楚地显示在控制台上。尝试一下。