如何在从控制器获取数据时遍历JSON对象
如何在从控制器获取数据时遍历JSON对象
提问于 2018-02-28 16:46:20
我正尝试在codeignitor中创建一个依赖下拉列表，但我不知道如何从Json获取值并在视图中显示结果
视图
<select id='countries_id' name="countries_id" onChange="getState(this.value);">
<option>-- Select countries --</option>
<?php foreach ($query->result() as $countries) { ?>
<option value="<?= $countries->id ?>"><?= $countries->name ?></option>
<?php } ?>
</select>
<select id='cities' name="city">
<option>-- Select deparment --</option>
</select>脚本
<script>
function getState(val) {
$.ajax({
type: "POST",
url: "<?= base_url()?>frontend/dependantdropdown/" + val,
data: 'countries_id=' + val,
success: function (data) {
console.log(data)
// $("#cities").html(data);
}
});
}
</script>控制器
public function dependantdropdown($id)
{
$this->db->select('*');
$this->db->from('cities');
$this->db->where('country_id', $id);
$data = $this->db->get();
echo json_encode($data);
}控制台上的响应
{
'conn_id': {
'affected_rows': null,
'client_info': null,
'client_version': null,
'connect_errno': null,
'connect_error': null,
'errno': null,
'error': null,
'error_list': null,
'field_count': null,
'host_info': null,
'info': null,
'insert_id': null,
'server_info': null,
'server_version': null,
'stat': null,
'sqlstate': null,
'protocol_version': null,
'thread_id': null,
'warning_count': null
},
'result_id': {
'current_field': null,
'field_count': null,
'lengths': null,
'num_rows': null,
'type': null
},
'result_array': [
],
'result_object': [
],
'custom_result_object': [
],
'current_row': 0,
'num_rows': 0,
'row_data': null
}这段代码运行良好，它访问控制器并在console.log中显示结果，但问题是如何获取此变量$data并迭代它，并在cities下拉列表中显示结果
回答 2
Stack Overflow用户
发布于 2018-02-28 16:56:54
如果$data是类似的数组，如下所示：
[
['id' => 1, 'name' => 'London'],
['id' => 2, 'name' => 'Paris'],
['id' => 3, 'name' => 'Singapore'],
['id' => 4, 'name' => 'New York'],
['id' => 5, 'name' => 'Istanbul'],
]您可以使用以下代码作为ajax的成功案例：
success: function (data) {
var o = $("#cities");
o.children(":gt(0)").remove(); // Remove all previous <option>, excluding the first "-- Select deparment --"
$.each(data, function(k, obj) {
o.append($("<option/>", {value: obj.id, text: obj.name}))
});
}Stack Overflow用户
发布于 2018-02-28 22:15:08
这很难解释所有。但希望这能帮助你解决你的问题
public function dependantdropdown($id)
{
$this->db->select('*');
$this->db->from('cities');
$this->db->where('country_id', $id);
$data = $this->db->get()->result_array();//as array
echo json_encode($data);
}现在你的javascript
function getState(val) {
$.ajax({
type: "POST",
datatype: "JSON",//use datatype
url: "<?= base_url()?>frontend/dependantdropdown/" + val,
data: 'countries_id=' + val,
success: function (data) {
var cities=JSON.parse(data);//convert it javascript array
//now you can loop two ways
//option 1.
$.each(cities, function(index,city) {
console.log(city['country_id']);
//use it as you like
});
//or option 2.
for(var i=0;i< cities.length;i++)
{
console.log(cities[i]['country_id']);
}
}
});
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/49025321
复制相关文章
相似问题
腾讯云开发者
