Question

我正在使用jQuery AutoComplete，我有一个自动完成的搜索框来搜索用户。

Default.aspx的

<script type="text/javascript" language="javascript">

    $(document).ready(function() {
        $("#<%= txtUser.ClientID %>").autocomplete('UsersAutoComplete.ashx');
    });

</script>

<asp:TextBox ID="txtUser" runat="server" />

UsersAutoComplete.ashx

public class UsersAutoComplete : IHttpHandler
{    
    public void ProcessRequest (HttpContext context)
    {
        List<User> users = DataContext.Users
            .Where(u => u.Username.StartsWith(context.Request.QueryString["q"]))
            .Take(Int32.Parse(context.Request.QueryString["limit"]))
            .OrderBy(u => u.Username)
            .ToList();

        foreach (User user in users)
        {
            context.Response.Write(user.Username + Environment.NewLine);
        }
    }

    public bool IsReusable
    {
        get { return false; }
    }
}

如您所见，它只返回用户名。我也想返回用户的UserID。

结果仍然只显示用户名列表，但是当有人选择用户时，我想将该用户的UserID存储为隐藏值，以便我可以随心所欲地使用它。我将对所选用户运行查询，而我更愿意通过UserID而不是用户名来查找用户。

有办法做到这一点吗？

Answer 1

我会创建一个包含您想要返回的值的类。然后使用值创建该类的新实例，并使用JSON序列化响应。

这应该足以让你指出正确的方向。

编辑：我就是这样做的。

$("#<%= txtUser.ClientID %>").autocomplete(
    {
        source: function (request, response) {
            $.ajax(
            {
                url: autocompleteSourceUrl,
                dataType: "json",
                type: "POST",
                data: { LookupPrefix: request.term, TotalResults: 10 },
                success: function (data) {
                    response($.map(data.LookupItems,
                        function (item) {
                            var itemLabel = item.DisplayName;

                            if (itemLabel.length > 37)
                                itemLabel = itemLabel.substring(0, 37) + "...";

                            return { label: itemLabel, value: item.DisplayName, data: item }
                        }))
                }
            });
        },
        minLength: 3,
        select: function (event, ui) {
            selectedItemData = ui.item.data;
        }
    });

这是我使用返回的自定义类设置自动完成的方法。我被退回的班级有以下结构：

{ Id: int, DisplayName: string }

另请注意选择功能。它存储对返回的数据项的内部引用。因此，当我需要提交该信息时，我可以查看selectedItemData并同时使用该类的所有属性。

我希望这会有所帮助。但是你要使用的部分是成功方法，我将对象分配给项目。

jQuery AutoComplete - 返回多个值

1 个答案: