Codeigniter选择框使用ajax无法正常工作

Question

我正试图使用ajax制作一个选择框，但它无法正常工作，我有两个选择框——一个用于国家，一个用于状态。当我选择一个国家时，它应该在另一个选择盒中获取状态。问题是，当我选择国家时，状态选择框中没有显示任何内容，但当我在控制台中进行检查时，它会向我提供类似的输出

<option value="">Select State</option><option value="603">Berat County</option><option value="629">Berat District</option>

我的控制器

function fetch_state()
{
if($this->input->post('country_id'))
{
$data= $this->Seller_Model->fetch_state($this->input->post('country_id'));
echo json_encode($data);
}

我的型号

function fetch_state($country_id)
{
$this->db->where('country_id', $country_id);
$this->db->order_by('name', 'ASC');
$query = $this->db->get('states');
$output = '<option value="">Select State</option>';
foreach($query->result() as $row)
{
$output .= '<option value="'.$row->id.'">'.$row->name.'</option>';

}
return $output;
}

这是我的观点

<div class="col-lg-6 col-md-12">
<div class="form-group looking">
<select name="ad_country" id="country1"onchange="change1(this.value)"  aria-placeholder="Select Status" class="nice-select form-control wide " required >
<option value="">Select Country</option>
<?php foreach ($get_country as $country) {
?>
<option value="<?php echo $country->id; ?>"  class="option"> 
<?php echo $country->name; ?>
</option>
<?php } ?>
</select>
</div>
</div>

<div class="col-lg-6 col-md-12">
<div class="form-group looking">
<select name="ad_state" id="state1"  aria-placeholder="Select Status" class="nice-select form-control wide " required >
<option value="">Select State</option>

</select>

</div>
</div>
<script>
function change1(vals)
{
var country_id = $('#country1').val();

if(country_id != '')
{
$.ajax({
url:"<?php echo base_url(); ?>Seller_Controller/fetch_state",
method:"POST",
data:{country_id:country_id},
dataType: 'json',
success:function(data)
{
$('#state1').find('option').not(':first').remove();
$('#ad_city1').find('option').not(':first').remove();
$.each(data,function(index,data){
$('#state1').append('<option value="'+data['id']+'">'+data['name']+'</option>');
});

}
});
}
else
{
$('#state1').html('<option value="">Select State</option>');
$('#ad_city1').html('<option value="">Select City</option>');
} 
}
</script>

Answer 1

这里的错误在于，在返回HTML的模型中，您应该返回请求查询的数组，这样函数json_encode((才能正常工作，因为它正在获取字符串，所以当您在ajax中为每个字符串查找时，请确保它在控制台中收到了错误或其他东西。

要进行调试，您可以使用浏览器的开发工具，您可以在控制台菜单中看到错误。