我有2个DropDownList,像主从。 这是我的Default.aspx:通过jQuery.Ajax的返回值附加到DropDownList
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<table>
<tr>
<td>
<asp:Label ID="MsLbl" runat="server" Text="Groups" />
</td>
<td>
<asp:DropDownList ID="Masterddl" runat="server">
<asp:ListItem Text="G1" Value="G1" />
<asp:ListItem Text="G2" Value="G2" />
<asp:ListItem Text="G3" Value="G3" />
</asp:DropDownList>
</td>
</tr>
<tr>
<td>
<asp:Label ID="Svlbl" runat="server" Text="Members" />
</td>
<td>
<asp:DropDownList ID="Slaveddl" runat="server" />
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
这是我的脚本:
$(document).ready(function() {
$('select#Masterddl').change(function() {
MasterChangeHandler($(this).val());
});
function MasterChangeHandler(Value) {
$.ajax({
type: 'Post',
url: 'MasterSlaveHandler.ashx',
dataType: "text",
data: 'ItemSelected=' + Value,
async: 'true',
success: function (data) { SuccessHandler1(data); }
});
}
function SuccessHandler1(data) {
$('select#Slaveddl').empty();
$.each(data, function (i, slaveValue) {
$('select#Slaveddl').append(
$('<option></option>').val(slaveValue.Value).html(slaveValue.Text)
);
});
}
和我的处理程序:
public class SlaveValues {
public string Value { get; set; }
public string Text { get; set; }
}
public class MasterSlaveDropDownListsHandler : IHttpHandler {
public bool IsReusable {
get { return true; }
}
public void ProcessRequest(HttpContext context) {
string valueSelected = context.Request["ItemSelected"];
List<SlaveValues> slaveValues = new List<SlaveValues>();
SlaveValues sv;
sv = new SlaveValues();
sv.Text = "SV1";
sv.Value = valueSelected + "s1";
slaveValues.Add(sv);
sv = new SlaveValues();
sv.Text = "SV2";
sv.Value = valueSelected + "s2";
slaveValues.Add(sv);
string responseText =
Newtonsoft.Json.JsonConvert.SerializeObject(slaveValues);
context.Response.ContentType = "text/json";
context.Response.Write(responseText);
}
}
但并没有什么附加。 我也看到在Firebug窗口的响应如下(当我选择从主DDL G2):
[{"Value":"G2s1","Text":"SV1"},{"Value":"G2s2","Text":"SV2"}]
,最后我改变剧本我的成功方法与测试这个新:
function SuccessHandler2(data) {
$('select#Slaveddl').empty();
$.each(data, function (i, slaveValue) {
$('select#Slaveddl').append(
$('<option></option>').val('Member' + i).html('Member' + i)
);
});
}
当尝试这个新的脚本绑定到奴隶ddl工作正常,但有一些额外的项目:索引显示member0到member30,我不知道为什么。
EDIT1: 我也试试这个,正确追加:
function SuccessHandler3(data) {
var values = [{ "Value": "G2s1", "Text": "SV1" }, { "Value": "G2s2", "Text": "SV2"}];
$('select#Slaveddl').empty();
$.each(values, function (i, slaveValue) {
$('select#Slaveddl').append(
$('<option></option>').val('Member' + slaveValue.Value).html('Member' +
slaveValue.Text)
);
});
}
所以我觉得有一个与操纵返回值(数据)的问题。
更具体的看法如下PIC是在Firebug窗口的JSON选项卡时,我选择在主DDL G3:
EDIT2:
我也试试这个,只是第一警报出现,显然(data.d)为空或不明物体:
function SuccessHandler6(data) {
var selection = $('select#Slaveddl');
$(selection).children().remove();
alert('in handler and remove children correctly');
if (data.d) {
alert('data.d is not null');
$(data.d).each(function (index, item) {
$(selection).append('<option>').val(item.Value).html(item.Text);
alert('after append in index: ' + index);
});
}
}
如何使用回报v alue正确并附加到Slave ddl?哪里有问题?
当我试图解决方案中的萤火虫显示:JSON.parse:意外的字符 [中断关于这个错误] var m = JSON.parse(data.d);并没有工作。 – Saeid