2

更新: 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です。コードイグナイターを使用しています。

<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;
  }
}
4

2 に答える 2

0

ajax 成功コールバックを次のように変更します。

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

あなたのajax結果は配列ではなくjsonオブジェクトだからです。

于 2012-06-15T09:56:55.867 に答える