Question

更新：通过禁用干扰Ajax成功响应的CodeIgniter Profiler来实现此目的。我认为它为JSON响应添加了一个div。

我正在尝试使用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。如果您不能没有分析器，请使用Making CodeIgniter’s Profiler AJAX compatible

上提供的解决方案

选择列表未填充（jQuery Ajax）

2 个答案: