如何使用 Web 服务方法的结果填充 DropDownList？答案

【问题标题】：How do I Populate a DropDownList with Results from a Web Service Method?如何使用 Web 服务方法的结果填充 DropDownList？
【发布时间】：2011-08-17 11:20:23
【问题描述】：

我有一个需要与 ASP.NET Web 服务交互的 ASP.NET 3.5 网络表单应用程序。 Web 服务提供要填充到下拉列表中的有效值列表。建议在客户端还是服务器端执行此操作？如果在服务器端完成，如何为我的 asmx Web 服务定义数据源集？如果在客户端完成，请推荐一个好的 JQuery 小部件。

非常感谢您的帮助！

【问题讨论】：

返回什么数据格式？ xml/json?

标签： asp.net web-services

【解决方案1】：

选择我会定义一个 WCF 服务，该服务使用内置的集合数据协定之一来呈现 JSON 中的列表：

[ServiceContract]
[AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)]
[ServiceBehavior(InstanceContextMode = InstanceContextMode.Single)]
public class optionsservice
{

    // Return a dynamic list of the options
    [WebInvoke(UriTemplate = "/getOptions?type={type}", Method = "GET", ResponseFormat = WebMessageFormatJson)]
    public SelectOptions getOptions(string filter = "")
    {

        SelectOptions returnOptions = new SelectOptions();
        //get your datatable here. 
        foreach (DataRow r in tbl.Rows)
       {
          returnOptions.Add((string)r["id"], (string)r["value"]);
       }
       return returnOptions;

    }

    [CollectionDataContract(Name = "collection",
            KeyName = "id",
            ValueName = "value",
            Namespace = "")]
    public class SelectOptions : Dictionary<string, string> { }
}

您也可以将数据表转换为列表，但这是我手头上唯一的示例代码

下面是你如何将盒子加载到 jQuery 中：

 <script type="text/javascript" src="jquery.js"></script>
      <script type="text/javascript" charset="utf-8">
      $(function(){
        $("select#ctlSelect").change(function(){
          $.getJSON("/select.php",{id: $(this).val(), ajax: 'true'}, function(j){
            var options = '';
            for (var i = 0; i < j.length; i++) {
              options += '<option value="' + j[i].id + '">' + j[i]value + '</option>';
            }
             $("select#ctlSelect").html(options);
          })
        })
      })
      </script>

【讨论】：