设置 AJAX 调用和填充下拉列表答案

【问题标题】：Setting an AJAX call and filling dropdown设置 AJAX 调用和填充下拉列表
【发布时间】：2013-11-15 14:38:42
【问题描述】：

所以这里我有两个下拉菜单：

<select id="CountryId">
<option value="16">UK</option>
<option value="17">Germany</option>
<option value="18">Italy</option>
<option value="19">Spain</option>
</select>


<select id="CityId"> </select>

在应用程序中，我有一个 php 函数，它按国家 ID 返回城市列表：

{"63":"Rome","65":"Palermo","72":"Torino","73":"Milan"}

我试图实现的是第一个下拉列表的 onChange 以获取国家/地区的 ID 并使用返回的城市填充第二个列表。

我尝试通过此 AJAX 调用来实现它，并尝试对其进行调试，但似乎没有任何效果。 var data 正在被接收，但没有其他任何事情发生。这是sn-p：

$('#CountryId').change(function(){
     var data = $('#EventCustomerId option:selected').val();

     $.ajax({
         type:'POST',
         async: true,
         cache: false,
         url: <?php echo Router::url(array('controller'=>'projects','action'=>'getbycustomer')) ?>,
         success: function(response) {
             jQuery('#CityId').html(response);
         },
         data: data
     });
     return false;
})

我不太确定用响应填充第二个下拉列表的方式。响应以 JSON 格式的纯 HTML 返回。

非常感谢任何帮助。

【问题讨论】：

标签： javascript ajax jquery

【解决方案1】：

您是否尝试过将 async 设置为 false？

    $('#CountryId').change(function(){
         var data = $('#EventCustomerId option:selected').val();
         $.ajax({
             type:'POST',
             async: false,
             cache: false,
             url: <?php echo  Router::url(array('controller'=>'projects','action'=>'getbycustomer')) ?>,
             success: function(response) {
                 jQuery('#CityId').html(response);
             },
             data: data
         });
    });

如果电话现在可以正常工作，您能在此处发布您的回复吗

【讨论】：