从 Ajax WebMethod 填充 ComboBox (ajaxToolkit)答案

【问题标题】：To fill a ComboBox (ajaxToolkit) from an Ajax WebMethod从 Ajax WebMethod 填充 ComboBox (ajaxToolkit)
【发布时间】：2016-08-03 00:21:52
【问题描述】：

在我的 ASPX 页面上，我有以下应该从 Ajax WebMethod 填充的 ComboBox。

<ajaxToolkit:ComboBox ID ="cbMembers" runat="server"></ajaxToolkit:ComboBox>

填充ComboBox的WebMethod调用如下：

$.ajax({
        type: "POST",
        url: functions.aspx/members",
        data: "{SearchInput: '" + SearchInput + "'}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (r) {                
            var cbMembers = $("[id*=cbMembers]");
            $.each(r.d, function () {
                cbMembers.append( -- My problem is here -- );
            })                
        }
    });

网络方法

List<ListItem> members = new List<ListItem>();
...
if (Reader.HasRows)
            { 
                while (Reader.Read())
                {
                    members.Add(new ListItem
                    {
                        Value = HttpUtility.HtmlEncode((string)(Reader["name"])),
                        Text = HttpUtility.HtmlEncode((string)(Reader["name"]))
                    });
                } 
            }
            return members;
...

从 WebMethod 正确检索数据。我测试了它。但我的问题是填写 ComboBox 中的列表项。有什么建议吗？

 success: function (r) {                
            var cbMembers = $("[id*=cbMembers]");
            $.each(r.d, function () {
                cbMembers.append( -- How to append the data here? --);
            })

        }

【问题讨论】：

我认为使用纯 javascript 来做这件事并不容易。问题是组合框不会像简单的选择那样呈现，而是作为 div 呈现，因此大量初始化是由 ASP.NET 完成的，您需要复制它。我建议考虑使用多选下拉菜单，这在 JS 中很容易处理，或者 UpdatePanel
你可能是对的。我尝试了很多方法，但似乎都没有正确填充 ComboBox。

标签： c# asp.net combobox webmethod

【解决方案1】：

试试这个

$.each(r.d, function () {
cbMembers.append($("<option>",{value:"1",text:"Gloria"}));
})

【讨论】：

填充 ComboBox 的正确方法是使用而不是
如果你看到html <asp:ListItem> 也呈现为option

【解决方案2】：

试试这个

        $.each(r.d, function () {
            cbMembers.append($("<option></option>").val(this['Value']).html(this['Text']));
        }

【讨论】：

请说明您的回答如何解决问题 - 谢谢。