javascript - codeigniter 中的依赖下拉列表

Question

我需要在选择国家/地区时在下拉列表中填写州列表。

我的代码

查看

<div class="form-group col-md-6">
                                       <label for="inputEmail4" class="uppercase pull-left m-0">Country</label>
                                         <!-- <input type="text" id="country" name="country" required value="<?php echo $row_all->country;?>"  placeholder="Please enter your country name"> -->

                                         <select name="country" id="country" required>
                                           <option value="">--select country--</option>
                                           <?php
                                            if($countries->num_rows()>0)
                                            {
                                                foreach ($countries->result() as $countries_row) {

                                             ?>
                                           <option <?php if($countries_row->id==$row_all->countryid){ echo "selected"; }?> value="<?php echo $countries_row->id;?>"><?php echo $countries_row->name;?></option>
                                           <?php
                                         } } ?>
                                         </select>
                                     </div>

                                     <div class="form-group col-md-6">
                                       <label for="inputPassword4" class="uppercase pull-left m-0">State</label>

                                       <select name="state" id="state" >
                                       </select>

                                     </div>

<script type='text/javascript'>
          // baseURL variable
          var baseURL= "<?php echo base_url();?>";

          $(document).ready(function(){

            // City change
            $('#country').change(function(){
              var country = $(this).val();
              alert(country);
              // AJAX request
              $.ajax({
                url:'<?php echo base_url()?>main/get_states',
                method: 'post',
                data: {country: country},
                dataType: 'json',
                success: function(response){
                  alert(response);
                  // Remove options
                  //$('#state').find('option').not(':first').remove();
                  //$('#city').find('option').not(':first').remove();

                  // Add options
                  $.each(response,function(get_states,data){
                     $('#state').append('<option value="'+data['id']+'">'+data['name']+'</option>');
                  });
                }
             });
           });


          });


         </script>

Controller

function get_states()
    {
        $this->load->helper('url');
    $postData = $this->input->post();
    $this->load->model('candidate_model');
    $data = $this->candidate_model->fetch_states($postData);
    echo json_encode($data);
    }

模型

候选人模型

function fetch_states($postData)
    {
             //$query = $this->db->query("SELECT * FROM states");
            //return $query;
        $response = array();
        // Select record
        $this->db->select('id,name');
        $this->db->where('country_id', $postData['country']);
        $q = $this->db->get('states');
        $response = $q->result_array();
        $response= json_encode($response);
        return $response;
    }

模型从数据库返回值，也可以从 View 访问。 我提醒响应，它返回类似 {"id":"36","name":"delhi"} 的数组。 我需要使用 id 状态将此结果填充到下拉列表中

有什么帮助吗？提前致谢

Answer 1

试试这个，
型号:

function fetch_states($country)
{
    $this->db->select('id,name');
    $this->db->where('country_id', $country);
    $q = $this->db->get('states');
    if ($q->num_rows() > 0) {
        return $q->result_array();
    }else{
        return array();
    }
}

Controller :

function get_states()
{
    $this->load->helper('url');
    $postData = $this->input->post();
    $this->load->model('candidate_model');
    $country = $postData['country'];
    $state = $this->candidate_model->fetch_states($country);
    $respose_array['state'] = $state;
    echo json_encode($response_array);
    exit();
}

查看ajax代码:

$.ajax({
    url:'<?php echo base_url()?>main/get_states',
    method: 'post',
    data: {country: country},
    dataType: 'json',
    success: function(response){
      $.each(JSON.parse(response.state),function(i,item){
         $('#state').append('<option value="'+item.id+'">'+item.name+'</option>');
      });
    }
});