当数据来自Web服务时如何在jquery自动完成中获取键值答案

【问题标题】：How to get the key value in jquery autocomplete when data coming from web service当数据来自Web服务时如何在jquery自动完成中获取键值
【发布时间】：2012-07-14 00:31:00
【问题描述】：

我的自动完成工作正常，因为我可以选择文本。但问题是我想获取所选项目的键值（Id）。所以我可以设置隐藏字段并使用服务器端。

这是我的网络方法代码：

[WebMethod]
    public List<string> AuotExtenderHotel(string hotelname)
    {
        DataSet ds = objHotelList.GetHotels(hotelname);
        List<string> result = new List<string>();
        foreach (DataRow dr in ds.Tables[0].Rows)
        {
            result.Add(dr["HotelName"].ToString());
        }
        return result;
    }

这是我的 jquery 自动完成代码

<script type="text/javascript">
    $(document).ready(function () { HotelText(); });
    function HotelText() {
        $(".txthotel").autocomplete({
            source: function (request, response) {
                $.ajax({
                    type: "POST",
                    contentType: "application/json; charset=utf-8",
                    url: "WebService.asmx/AuotExtenderHotel",
                    data: "{'hotelname':'" + $('.txthotel').val() + "'}",
                    dataType: "json",
                    success: function (data) {

                        response(data.d);


                    },
                    error: function (result) {
                        alert("Error");
                    }


                });
            }
        });
    } 
</script>

【问题讨论】：

您是否尝试过阅读文档？ jQuery autocomplete events 之一是“选择”，并在选择项目时触发。
@moranjk 是的，我找到了该事件，但我不知道如何获取所选字符串的值部分
看一下Autocomlete的Demo中使用的search.php的结果jqueryui.com/demos/autocomplete/search.php?term=Great

标签： jquery asp.net json web-services jquery-autocomplete

【解决方案1】：

如果您的服务器没有返回除字符串数组之外的任何内容，您怎么能期望视图中的项目的 Id？我会修改 web 方法以返回一个 JSON 对象，其中包括 ID 和值对的对象。喜欢

[{ "id": "1", "label": "MyFirstHotel", "value": "MyFirstHotel" },{ "id": "2", "label": "MySecondHotel", "value": "MySecondHotel" }]

【讨论】：

【解决方案2】：

我真的希望现在已经弄清楚了，但以防万一......

文档状态显示了“选择”事件在选择项目时被解雇，并将原型作为select: function(event, ui) { ... }

在函数中放置一点console.log(ui) 会显示 ui 对象为：

{
  item :
  {
    label : "the selected label",
    value : "the selected value"
  }
}

【讨论】：