选择列表未填充（jQuery Ajax）

Question

更新：通过禁用会干扰Ajax成功响应的CodeIgniter Profiler来完成此工作。 我认为它将div添加到JSON响应中。

我正在尝试用mysql数据库中的数据填充从属选择框。 问题在于，尽管响应于Ajax请求以正确的格式获取数据，也没有填充从属选择框。

请帮我，因为我对这里发生的事情一无所知。 以下是我的JavaScript代码。

<script type="text/javascript">

$(document).ready(function(){
    $('#country').change(function(){ 
        $("#cities > option").remove(); 

        var form_data = {
            country: $('#country').val(),
            csrf_token_name: $.cookie("csrf_cookie_name")
        };

        $.ajax({
            type: "POST",
            url: "http://localhost/outlets/get_cities", 
            data: form_data,
            dataType : "JSON",
            success: function(cities)
            {
               $.each(cities,function(id,name)
                {
                    var opt = $('<option />'); 
                    opt.val(id);
                    opt.text(name);
                    $('#cities').append(opt); 
                });
            }

        });

    });
});
</script>

这是HTML。 我正在使用Codeigniter。

<form id="form">
<?php $cities['#'] = 'Please Select'; ?>
<label for="country">Country: </label><?php echo form_dropdown('country_id', $countries, '#', 'id="country"'); ?><br />
<label for="city">City: </label><?php echo form_dropdown('city_id', $cities, '#', 'id="cities"'); ?><br />
</form>

这是控制器：

function get_cities(){
    $country = $this->input->post('country');
  $this->load->model('city');
  header('Content-Type: application/x-json; charset=utf-8');
  echo (json_encode($this->city->get_cities($country)));
}

＆ 该模型：

function get_cities($country = NULL){
  $this->db->select('id, name');

  if($country != NULL){
      $this->db->where('countries_id', $country);
  }
  $query = $this->db->get('cities');

  $cities = array();

  if($query->result()){
      foreach ($query->result() as $city) {
          $cities[$city->id] = $city->name;
      }
  return $cities;
  }else{
      return FALSE;
  }
}

Answer 1

将您的ajax成功回调更改为：

    success: function (cities) {
        for (var id in cities) {
            var opt = $('<option />');
            opt.val(id);
            opt.text(cities[id]);
            $('#cities').append(opt);
        }
    }

因为您的ajax结果不是数组而是json对象。

Answer 2

好的，大家好，我设法通过禁用CodeIgniter Profiler使其正常工作。 Codeigniter探查器，否则是一个方便的工具，会使用Ajax破坏任何页面上的javascript。 如果不能没有分析器，请使用使CodeIgniter的分析器AJAX兼容提供的解决方案