如何在jQuery中用JSON数据填充下拉列表？
我正在开发一个国家/地区级联下拉列表…我基于返回了json结果，countryId但我不知道如何在新的下拉列表框中填充/填充它。
这是我正在使用的
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;
}
警报给了这个
{"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"}]}
我的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>
关于如何填充DLState下拉菜单的任何建议…
编辑：
当我通过萤火虫检查时，我收到了有关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\"}]}"}
问题答案：
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);
例
<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);
});
-
问题内容： 我有以下jQuery代码。我可以从server获得以下数据。我该如何对此进行迭代，并用 另外，使用和之间有什么区别。 问题答案： 这应该可以解决问题： 这里的区别和（从jQuery的文档）： [getJSON]是Ajax的简写功能，等效于： 编辑：要明确，部分问题是服务器的响应返回的是如下所示的json对象： …因此该属性需要使用手动解析。
-
问题内容： 我知道在这个问题上有很多问题，但是我仍然不确定该怎么做。 我有一个名为“ CuisineForm”的HTML表单，在用户选择了美食类型之后，AJAX将该表单发送到服务器。AJAX调用工作正常，并且服务器以JSON响应进行响应，其中包含此特定美食的所有服务时间。这些服务时间分为早餐，午餐和晚餐。 这些时间需要以相同的形式填充到3个单独的下拉菜单中。 但我真的不知道如何处理JSON结果以填
-
问题内容： 就像标题中所说的那样，尽管我对尚未付诸实践的理论很熟悉，但我仍在尝试使用jQuery，JSON和AJAX创建下拉菜单，因此，任何建议，演示代码段或教程都将不胜感激，因为我想开始最好的开始！ 提前感谢！ 问题答案： 您需要执行$ .getJSON调用以从document.load或其他一些事件http://api.jquery.com/jQuery.getJSON/上的服务器中获取jso
-
问题内容： 我有以下问题： 我开始用HTML和JS创建表单，并且有两个下拉菜单（国家和城市）。现在，我想使用JQuery使这两个动态，以便仅显示所选国家/地区的城市。 我从一些基本的JS入手，但效果不错，但在IE中却有些麻烦。现在，我正在尝试将JS转换为JQuery，以获得更好的兼容性。 我原来的JS看起来像这样： 我知道这很简单，但是我看不到树木的木头。 问题答案： 它应该像
-
问题内容： 我设法用json对象填充下拉菜单，效果很好。目前，我正在尝试根据从下拉菜单中选择的选项显示隐藏div中的图像。当下拉列表由json对象填充时，我将如何检索图像数据。 HTML JSON文件 这就是我使用jquery填充下拉菜单的方式。 jfiddle中任何有效的示例，将不胜感激！谢谢。 问题答案： 现场演示
-
问题内容： 我打算根据其他下拉菜单的选择使用AJAX填充下拉框。我遵循了使用位于此处的jQuery的教程-http: //remysharp.com/2007/01/20/auto-populating-select-boxes-using-jquery- ajax/ ，并在选择框名称中更改了选择框ID名称。在脚本中。 当主复选框的值发生更改时，将发送ajax并返回如下： 这与教程代码中返回的JS