我按照http://www.aspforums.net/Threads/120224/Populate-ASPNet-CheckBoxList-ClientSide-using-jQuery-AJAX/
上的说明操作这会填充复选框列表,但点击的任何标签都会选中或取消选中复选框列表中的第一项。我如何修复代码让“for”标签指向正确的复选框 JavaScript返回xml
<asp:CheckBoxList ID="chkaddressemails" Width="300px" runat="server">
</asp:CheckBoxList>
function GetDropDownData(o) {
var ddlTestDropDownListXML = document.getElementById(o.id);
// Provide Some Table name to pass to the WebMethod as a parameter.
var tableName = ddlTestDropDownListXML.options[ddlTestDropDownListXML.selectedIndex].value;
$.ajax({
type: "POST",
url: "Reports.aspx/GetDropDownItems",
data: '{tableName: "' + tableName + '"}',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
var xmlDoc = $.parseXML(response.d);
var xml = $(xmlDoc);
var customers = xml.find("Table1");
var row = $("[id*=chkaddressemails] tr:last-child").clone(true);
$("[id*=chkaddressemails] tr").remove();
$.each(customers, function () {
var customer = $(this);
$("input", row).val($(this).find("Email").text());
$("label", row).html($(this).find("Grouping").text());
$("[id*=chkaddressemails] tbody").append(row);
row = $("[id*=chkaddressemails] tr:last-child").clone(true);
});
},
failure: function (response) {
alert(response.d);
}
});
}
答案 0 :(得分:0)
以下是答案。 ajax调用一个静态函数,该函数返回转换为xml的数据表。 然后我清除旧数据并重新填充复选框列表。我也得到了值并将其放入文本框中。
<asp:DropDownList ID="ddladdresscustomers" Width="300px" AutoPostBack="false" onchange="GetDropDownData(this);" runat="server"></asp:DropDownList>
function GetDropDownData(o) {
var ddlTestDropDownListXML = document.getElementById(o.id);
// Provide Some Table name to pass to the WebMethod as a parameter.
var tableName = ddlTestDropDownListXML.options[ddlTestDropDownListXML.selectedIndex].value;
$.ajax({
type: "POST",
url: "Reports.aspx/GetDropDownItems",
data: '{tableName: "' + tableName + '"}',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
var xmlDoc = $.parseXML(response.d);
var xml = $(xmlDoc);
var customers = xml.find("Table1");
var table = $('<table></table>');
var counter = 0;
var customer = $(this);
$.each(customers, function () {
table.append($('<tr></tr>').append($('<td></td>').append($('<input>').attr({
type: 'checkbox', name: 'chklistitem', value: $(this).find("Email").text(), id: 'chklistitem' + counter
})).append(
$('<label>').attr({
for: 'chklistitem' + counter++
}).text($(this).find("Grouping").text()))));
});
var y = $('#<%= chkaddressemails.ClientID %>');
getallfromcheckbox();
removeCheckBoxItem();
y.append(table);
},
failure: function (response) {
alert(response.d);
}
});
}
function removeCheckBoxItem()
{
$("[id*=chkaddressemails] :checkbox").parent().remove();
}
function getallfromcheckbox()
{
var retur = '';
var y = $('#<%= txtaddressemail.ClientID %>');
var names = [];
$('[id*=chkaddressemails] input:checked').each(function () {
names.push(this.name);
retur += (this.value) +';';
});
document.getElementById("<%= txtscheduleemail.ClientID %>").value = retur;
}