jQuery自動完成 - 返回多個值

我正在使用jQuery自動完成，並且我有一個自動完成搜索框來搜索用戶。jQuery自動完成 - 返回多個值

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; } 
    } 
}

正如你所看到的，它只返回用戶名。我也想返回用戶的用戶ID。

結果仍然只顯示用戶名列表，但是當有人選擇一個用戶時，我想將該用戶的用戶ID存儲在一個隱藏的值中，以便我可以隨心所欲地做任何事情。我將在選定的用戶上運行一個查詢，並且我寧願用UserID而不是用戶名來查找用戶。

有沒有辦法做到這一點？

來源

2010-10-06 Steven

我會創建一個包含你想返回的值的類。然後用這些值創建該類的新實例並使用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，並在當時使用該類的所有屬性。

我希望這有助於多一點。但是，與您一起工作的部分將在我將對象分配給該項目的成功方法中。

來源

2010-10-06 19:26:01 spinon

謝謝，這讓我半途而廢。但是，在結果中爲每個用戶存儲用戶ID的位置在哪裏？作爲每個李的一個類？我該如何儲存它？ – Steven 2010-10-06 19:51:21

那麼你會創建一個具有用戶名和userid屬性的類。然後將序列化的類返回到自動完成代碼。它會序列化它。你可以告訴自動完成返回的數據是JSON。然後就像你通常使用的屬性。讓我舉個例子。 – spinon 2010-10-06 19:54:49

我可以處理返回的JSON結果，我的困惑是在獲得該數據後在前端執行什麼操作。我需要一種方法將結果中的每個項目與UserID關聯起來，但我不確定如何。 – Steven 2010-10-06 20:04:22

jQuery自動完成 - 返回多個值

回答

相關問題