Question

我的代码中有一个案例，结果没有显示或工作，城市表单选择仍然是空白。这是HTML：

<div class="form-group">
  <label>Province</label>
  <select class="form-control" name="province" id="province">

    <?php foreach($state_data->data as $sd){ ?>
    <option id="<?php echo $sd->code; ?>" value="<?php echo $sd->code; ?>" <?php echo (isset($this->session->userdata))?(($this->session->userdata('session_state_code') == $sd->code)?"selected":""):"";?>>
      <?php echo $sd->name ;?>
    </option>
    <?php } ?>
  </select>
</div>
<div class="form-group" id="city_section">
  <label>City</label>
  <select class="form-control" name="city" id="city">

    <?php foreach($city_data->data as $cd){ ?>
    <option value="<?php echo $cd->code; ?>" <?php echo (isset($this->session->userdata))?(($this->session->userdata('session_city_code') == $cd->code)?"selected":""):"";?>>
      <?php echo $cd->name ;?>
    </option>
    <?php } ?>
  </select>
</div>

这是从控制器获取数据的javascript：

$('#province').on('change', function() {
      var id = $(this).val();;
      $.ajax({
        type: "POST",
        dataType: 'json',
        url: "<?php echo base_url() ?>edit_profile/get_city",
        data: {
          id: $(this).val()
        },
        success: function(data) {
          $('select#city').html('');
          for (var i = 0; i < data.length; i++) {
            $("<option />").val(data[i].code)
              .text(data[i].name)
              .appendTo($('select#city'));
          }
        }
      });
    }

这是控制器从API获取数据：

public function get_city(){
  $m_url = URL_API;
  $function = "get_location";
  $i = $_REQUEST['id'];
  $url = $m_url . "/" . $function . "?" . "t=city" . "&" . "i=".$i;
  $json_data = file_get_contents($url);
  $data = json_decode($json_data);  
}

Answer 1

你的函数不会向你需要的任何内容返回任何内容echo json_decode

public function get_city(){
        $m_url = URL_API;
        $function = "get_location";
        $i = $_REQUEST['id'];
        $url = $m_url . "/" . $function . "?" . "t=city" . "&" . "i=".$i;
        $json_data = file_get_contents($url);
        echo $data = json_decode($json_data);// use echo here
    }

Answer 2

你不需要json_decode（），只需打印$ json_data。因为，它已经通过file_get_contents（）以字符串形式返回。

public function get_city(){

    $m_url = URL_API;
    $function = "get_location";
    $i = $_REQUEST['id'];
    $url = $m_url . "/" . $function . "?" . "t=city" . "&" . "i=".$i;
    $json_data = file_get_contents($url);
    echo $json_data;


}

将返回的数据转换为JSON对象。然后使用它：

   success: function(data) {
      var jsonObj = JSON.parse(data);
      $('select#city').html('');
      for (var i = 0; i < jsonObj.length; i++) {
        $("<option />").val(jsonObj[i].code)
          .text(jsonObj[i].name)
          .appendTo($('select#city'));
      }
    }

Answer 3

拥有echo $json_data;，现在尝试在您的Ajax中放置error回调，以便您看到请求的错误响应。从那里你可以了解这个过程中出了什么问题。

error: function(err){
  console.log(err.responseText);
}

如何在Codeigniter中使用ajax on select（下拉选项值）从API获取数据？

3 个答案: