javascript - 填充的下拉列表在下拉选项中返回 "undefined"

Question

我试图根据下拉列表中的选定状态获取城市名称列表，但在下拉选项中显示“未定义”。我认为我的 javascript 代码有问题，但我不知道是什么。

我的 ajax 函数:

function getcities(obj) {
var stateid = obj.val();

$.ajax({
    url:base_url+'home/get_cities',
    type:'POST',
    data:{ 'state_id':stateid},
    success:function(response){
        var temp = $.parseJSON(response);

        if(temp.status == 'success') {

            var cities = temp.data;
            var opts = '';
            var optsli = '';
            $.each(cities,function(key,value){
                opts+='<option value="'+value.id+'">'+value.name+'</option>';
                optsli+='<li data-raw-value="'+value.id+'" class="">'+value.name+'</li>';

            });

            $("#city").html(opts); 
            $("#city").next(':eq(0)').next().html(optsli);


        }
        else {

            return false;
        }               
    }
});

}

我在 home.php 文件中的 Controller 函数:

public function get_cities() {
    $state_id = $this->input->post('state_id');
    $results = $this->Common_model->get_cities($state_id);
    if( count($results) > 0 )
    {
        $response['status'] = 'success';
        $response['data'] = $results;
    }
    else {
        $response['status'] = 'error';
        $response['data'] = '';
        }
        echo json_encode($response);
        // exit;
}

我在我的模型中的功能:

function get_cities($state_id)
{
    $response = array();
    $this->db->where('state_id',$state_id);
        $query  = $this->db->get('cities')->result_array();
    if( is_array( $query ) && count( $query ) > 0 )
     {
             $response['0'] = 'Select City';
             foreach($query as $row)
             {
                 $response[$row['id']] = $row['name'];
             }
     }
     return $response;

}

我认为州和城市的下拉列表:

<div class="form-group">
     <?php echo form_label('State', 'state'); ?>
     <div class="selectpickercolm personal clearfix">
        <div class="slctn">
        <?php echo form_dropdown('state', $states, $user['state'],array('id' => 'state','class' => 'form-control','onchange' => 'getcities($(this))')); ?>

        </div>
    </div>
</div>              


<div class="form-group">
        <?php echo form_label('City', 'city'); ?>
     <div class="selectpickercolm personal clearfix">
        <div class="slctn">
        <?php echo form_dropdown('city', $cities, $user['city'],array('id' => 'city','class' => 'form-control')); ?>                                        
        </div>
    </div>

</div>

Answer 1

像下面那样做:-

function getcities(obj) {
    var stateid = obj.val();

    $.ajax({
        url:base_url+'home/get_cities',
        type:'POST',
        dataType:'json', //change here
        data:{ 'state_id':stateid},
        success:function(response){
            var temp = response; //change here

            if(temp.status == 'success') {

                var cities = temp.data;
                var opts = '';
                var optsli = '';
                $.each(cities,function(key,value){
                    opts+='<option value="'+key+'">'+value+'</option>';
                    //optsli+='<li data-raw-value="'+value.id+'" class="">'+value.name+'</li>';

                });

                $("#city").html(opts); 
                //$("#city").html(optsli);


            }
            else {
                return false;
            }               
        }
    });

}