如何在 jquery 中使用 json 数据填充下拉列表？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2637694/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to populate a dropdownlist with json data in jquery?
提问by ACP
I am developing a country state cascading dropdown list... I returned json result based on countryIdbut I don't know how to populate/fill it in a new dropdown listbox...
我正在开发一个国家级级联下拉列表......我返回了基于的 json 结果，countryId但我不知道如何在新的下拉列表框中填充/填充它......
Here is what I am using,
这是我正在使用的，
function getstate(countryId) {
$.ajax({
type: "POST",
url: "Reg_Form.aspx/Getstates",
data: "{'countryId':" + (countryId) + "}",
contentType: "application/json; charset=utf-8",
global: false,
async: false,
dataType: "json",
success: function(jsonObj) {
alert(jsonObj.d);
}
});
return false;
}
And alert gave this,
警报给出了这个，
{"Table" : [{"stateid" : "2","statename" : "Tamilnadu"},
{"stateid" : "3","statename" : "Karnataka"},
{"stateid" : "4","statename" : "Andaman and Nicobar"},
{"stateid" : "5","statename" : "Andhra Pradesh"},
{"stateid" : "6","statename" : "Arunachal Pradesh"}]}
And my aspx page has this,
我的aspx页面有这个，
<td>
<asp:DropDownList ID="DLCountry" runat="server" CssClass="dropDownListSkin"
onchange="return getstate(this.value);">
</asp:DropDownList>
</td>
<td>
<asp:DropDownList ID="DLState" runat="server" CssClass="dropDownListSkin">
</asp:DropDownList>
</td>
Any suggestion on how to fill DLStatedropdown...
关于如何填充DLState下拉菜单的任何建议...
EDIT:
编辑：
When I inspected through firebug I got the response for my ajax post,
当我通过萤火虫检查时，我得到了我的 ajax 帖子的回复，
{"d":"{\"Table\" : [{\"stateid\" : \"2\",\"statename\" : \"Tamilnadu\"},{\"stateid\" : \"3\",\"statename\" : \"Karnataka\"},{\"stateid\" : \"4\",\"statename\" : \"Andaman and Nicobar\"},{\"stateid\" : \"5\",\"statename\" : \"Andhra Pradesh\"},{\"stateid\" : \"6\",\"statename\" : \"Arunachal Pradesh\"},{\"stateid\" : \"7\",\"statename\" : \"Assam\"},{\"stateid\" : \"8\",\"statename\" : \"Bihar\"},{\"stateid\" : \"9\",\"statename\" : \"Dadra and N. Haveli\"},{\"stateid\" : \"10\",\"statename\" : \"Daman and Diu\"},{\"stateid\" : \"11\",\"statename\" : \"Delhi\"},{\"stateid\" : \"12\",\"statename\" : \"Goa\"},{\"stateid\" : \"13\",\"statename\" : \"Gujarat\"},{\"stateid\" : \"14\",\"statename\" : \"Haryana\"},{\"stateid\" : \"15\",\"statename\" : \"Himachal Pradesh\"},{\"stateid\" : \"16\",\"statename\" : \"Jammu and Kashmir\"},{\"stateid\" : \"17\",\"statename\" : \"Kerala\"},{\"stateid\" : \"18\",\"statename\" : \"Laccadive Islands\"},{\"stateid\" : \"19\",\"statename\" : \"Madhya Pradesh\"},{\"stateid\" : \"20\",\"statename\" : \"Maharashtra\"},{\"stateid\" : \"21\",\"statename\" : \"Manipur\"},{\"stateid\" : \"22\",\"statename\" : \"Meghalaya\"},{\"stateid\" : \"23\",\"statename\" : \"Mizoram\"},{\"stateid\" : \"24\",\"statename\" : \"Nagaland\"},{\"stateid\" : \"25\",\"statename\" : \"Orissa\"},{\"stateid\" : \"26\",\"statename\" : \"Pondicherry\"},{\"stateid\" : \"27\",\"statename\" : \"Punjab\"},{\"stateid\" : \"28\",\"statename\" : \"Rajasthan\"},{\"stateid\" : \"29\",\"statename\" : \"Sikkim\"},{\"stateid\" : \"30\",\"statename\" : \"Tripura\"},{\"stateid\" : \"31\",\"statename\" : \"Uttar Pradesh\"},{\"stateid\" : \"32\",\"statename\" : \"West Bengal\"}]}"}
回答by Jon
var listItems= "";
var jsonData = jsonObj.d;
for (var i = 0; i < jsonData.Table.length; i++){
listItems+= "<option value='" + jsonData.Table[i].stateid + "'>" + jsonData.Table[i].statename + "</option>";
}
$("#<%=DLState.ClientID%>").html(listItems);
Example
例子
<html>
<head></head>
<body>
<select id="DLState">
</select>
</body>
</html>
/*javascript*/
var jsonList = {"Table" : [{"stateid" : "2","statename" : "Tamilnadu"},
{"stateid" : "3","statename" : "Karnataka"},
{"stateid" : "4","statename" : "Andaman and Nicobar"},
{"stateid" : "5","statename" : "Andhra Pradesh"},
{"stateid" : "6","statename" : "Arunachal Pradesh"}]}
$(document).ready(function(){
var listItems= "";
for (var i = 0; i < jsonList.Table.length; i++){
listItems+= "<option value='" + jsonList.Table[i].stateid + "'>" + jsonList.Table[i].statename + "</option>";
}
$("#DLState").html(listItems);
});
回答by Bill Fote
//javascript
//teams.Table does not exist
function OnSuccessJSON(data, status) {
var teams = eval('(' + data.d + ')');
var listItems = "";
for (var i = 0; i < teams.length; i++) {
listItems += "<option value='" + teams[i][0]+ "'>" + teams[i][1] + "</option>";
}
$("#<%=ddlTeams.ClientID%>").html(listItems);
}
回答by turbob1234
To populate ComboBox with JSON, you can consider using the: jqwidgets combobox, too.
要使用 JSON 填充 ComboBox，您也可以考虑使用：jqwidgets 组合框。
回答by hithin chandran
try this one its worked for me
试试这个对我有用
$(document).ready(function(e){
$.ajax({
url:"fetch",
processData: false,
dataType:"json",
type: 'POST',
cache: false,
success: function (data, textStatus, jqXHR) {
$.each(data.Table,function(i,tweet){
$("#list").append('<option value="'+tweet.actor_id+'">'+tweet.first_name+'</option>');
});}
});
});