[英]Pulling in JSON via AJAX to populate a Drop-Down
I am pulling in some JSON data that will vary... for instance: 我提取了一些会有所不同的JSON数据,例如:
Data returned could be: 返回的数据可能是:
[{"userID":"2779","UserFullName":" Absolute Pro-Formance"},{"userID":"2780","UserFullName":" AR Fabrication"},{"userID":"2781","UserFullName":" Banda Lucas Design Group"}]
or: 要么:
[{"orderID":"112958","OrderName":"Order ID: 112958"},{"orderID":"112957","OrderName":"Order ID: 112957"},{"orderID":"112956","OrderName":"Order ID: 112956"}]
What I am attempting to do is process this JSON to build a <select>
list. 我正在尝试做的是处理此JSON以构建<select>
列表。
// Load in a drop-down as JSON
function LoadDropDown($url, $where, $id, $selectName){
var $loading = '<div class="pageLoader" style="margin:0 auto !important;padding:0 !important;"><img src="/assets/images/ajax-loader.gif" alt="loading..." height="11" width="16" /></div>';
var $t = Math.round(new Date().getTime() / 1000);
var $container = jQuery($where);
var options = {
url: $url + '?_=' + $t,
cache: false,
type: 'POST',
beforeSend: function(){
$container.html($loading);
},
success: function(data, status, jqXhr){
$html = '<select class="form-control" id="'+$selectName+'" name="'+$selectName+'">';
$html += '<option value="0">- Select an Option -</option>';
for(var i = 0; i < data.length-1; ++i) {
var item = data[i];
console.log(item.userID);
}
$html += '</select>';
$container.html('<pre>' + data + '</pre>');
},
complete: function(jqXhr, status){},
error: function(jqXhr, status, error){
$container.slideDown('fast').html('<div class="alert alert-danger alert-dismissable"><button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button><i class="fa fa-exclamation-triangle fa-4x pull-left"></i><p><strong>Danger Will Robinson!</strong><br />There was an issue pulling in this page. Our support team has been notified, please check back later.</p></div>');
}
};
jQuery.ajax(options);
}
The issue I am having is... #1 console.log(item.userID);
我遇到的问题是...#1 console.log(item.userID);
always shows undefined
, and #2 how can I effecitvely dynamically build the options? 总是显示undefined
,并且#2如何有效地动态构建选项? The returned JSON will ALWAYS contain 2 items per row
and id
, and a name
返回的JSON总是每row
包含2个项目和id
,以及一个name
for(var $key in data){
var $val = data[$key];
for($j in $val){
console.log('name:' + $j + ' = ' + $val[$j]);
}
}
Is showing me what I need in Firefox Console... But 1 item per line, for each (for example the 1st JSON) name:userID = 1234
next line name:UserFullName = TheName
正在显示我在Firefox控制台中需要的内容...但是每行有一项,每行(例如第一个JSON) name:userID = 1234
下一行name:UserFullName = TheName
How can I get them so I can build my <options>
? 如何获得它们,以便构建我的<options>
?
With: 附:
for(var k in data) {
console.log(k, data[k]);
}
I am returned: 我回来了:
2955 Object { orderID="8508", OrderName="Order ID: 8508"}
and 和
2955 Object { userID="1355", UserFulleName="Me Myself And I"}
You don't need to use such messy code. 您无需使用此类凌乱的代码。 Also in your Ajax setup dataType:"json"
同样在您的Ajax设置中dataType:"json"
success:function() {
var listB=$('#yourdropdownId');
listB.empty();
$.each(result, function (index, item) {
listB.append(
$('<option>', {
value: item.userID,
text: item.UserFullName
}, '<option/>'))
});
}
Also the $.getJson instead of ajax if you only want retrieve json from server 如果只想从服务器检索json,也可以使用$ .getJson而不是ajax
$.getJSON('@Url.Action(" "," ")',
{ "youparametername": yourdata}, function (data) {
$.each(data, function (index, item) {
})
});
inside the options object, make sure to use the 在options对象中,请确保使用
dataType: 'json'
Or in the success handler you can use 或者,您可以在成功处理程序中使用
JSON.parse(data)
Cured: Changed my loop to cycle through each item in the returned JSON, got their keys, etc... 已治愈:更改了我的循环,以循环遍历返回的JSON中的每个项目,获取其密钥等。
var $dl = data.length;
for(var $i = 0; $i < $dl - 1; ++$i) {
var $keys = Object.keys(data[$i]);
$html += '<option value="' + data[$i][$keys[0]] + '">' + data[$i][$keys[1]] + '</option>';
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.