从服务器json响应（如何填充从selectbox中的服务器的响应）

Question

我想填充使用jQuery的$ .ajax方法的选择框（城市相关的状态）。

我写在我的PHP脚本

$('#cmbState').change(function(){ 
    $('#cmbCity').children().remove(); 
    $.ajax({ 
    type: "POST", 
    url: "../include/ajax.php", 
    data: "option=getCitiesList&stateid="+$(this).val()+"", 
    dataType: "json", 
    complete: function(response){ 
    'what should I write in here ..?' 
    }, 
    beforeSend: function(){$('#cmbCity').addClass('show_loading_in_center')}, 
    success: function(){$('#cmbCity').removeClass('show_loading_in_center')} 
    }); 
    }); 

以下，并在（其中查询被用于获取realted城市发送的文件）的文件“ajax.php”我做了

$i=0; 
foreach($cities as $city) 
{ 
    $response[$i]['id'] = $city['pk_cityid']; 
    $response[$i]['name'] = $city['name']; 
    $i++; 
} 
echo json_encode($response); 

现在，响应以XMLHTTPResponse对象的形式出现。 我应该如何将响应填入城市选择框？

请帮忙，我真的被困在这里。

感谢

Answer 1

$('#cmbState').change(function() { 
    $.ajax({ 
     type: "POST", 
     url: "../include/ajax.php", 
     data: {option: "getCitiesList", stateid: $(this).val()}, 
     dataType: "json", 

     success: function (data) { 
      var $cmbCity = $('#cmbCity').empty(); 
      $.each(data, function() { 
       $cmbCity.append('<option value="' + this.id + '">' + this.name + '</option>') 
      }); 
     }, 

     beforeSend: function(){ $('#cmbCity').addClass('show_loading_in_center') }, 
     complete: function(){ $('#cmbCity').removeClass('show_loading_in_center') } 
    }); 
}); 

你需要写一个success处理器将与传递的数据（completed被称为甚至错误）被调用。数据作为第一个参数传递。我们首先选择empty()并将其分配给$cmbCity以提高性能。然后，我们使用$.each（跨浏览器jQuery迭代）遍历data，该文件将每个元素绑定到this。使用我们在#cmbCity中选择创建新选项。

上面的代码假定响应是以下格式：

[{"id": 1, "name": "London"}, 
{"id": 2, "name": "Paris"}, 
{"id": 3, "name": "New York"}] 

另外，还要注意data（在上面的$就调用）是键值格式 - jQuery将自动序列化。