爲用戶提供過濾下拉列表的搜索功能

我正在開發用於數據輸入的ASP.NET表單。用戶必須從充滿大約1000個客戶端的下拉列表中選擇一個客戶端。爲用戶提供過濾下拉列表的搜索功能

現在，客戶端列表不斷增加，用戶請求我添加查找功能：他們想輸入部分名稱並使用名稱匹配的客戶端篩選下拉列表。因此，如果他們鍵入'aaa'，他們希望只看到名稱中帶有'aaa'的客戶。

我已經看過ajax控件工具包的自動完成功能，但是可以在文本框中使用，而不是在下拉列表中使用。

任何人都可以提出一個很好的解決方案嗎？

來源

2009-08-29 edosoft

然後在文本框中使用它！當然，下拉列表中的人知道客戶的名字。在我看來，這種情況幾乎沒有什麼區別。

我一直在使用jQuery標籤建議添加在我的MVC應用程序，它工作得很好。

http://remysharp.com/2007/12/28/jquery-tag-suggestion/

如果你有興趣只是評論，我會給你我使用的代碼。

如果您確實想使用下拉列表，您可以在更新面板中使用文本框和下拉列表。當用戶輸入文本（然後單擊按鈕）時，可以使用篩選出的用戶輸入內容的結果填充下拉列表。

來源

2009-08-29 21:52:03 j82374823749

我使用下拉列表的原因是客戶端的Id綁定到（選定的）值。當使用文本框時，我必須使用名稱查找客戶端。 – edosoft 2009-08-29 22:07:54

正在查找客戶端ID是一個主要問題？如果下拉列表只有靜態值，我可以看到這是一個問題，但是如果從數據庫填充它，應該很容易查找ID。我總是覺得標籤表明文本框增加了更多的控制，靈活性，並且肯定會對用戶更具吸引力。 – j82374823749 2009-08-29 23:13:12

爲了簡單起見，我決定使用文本框+下拉選項。謝謝 – edosoft 2009-08-30 18:47:24

我認爲一個文本框實際上是首選爲此。一個選擇框不會邀請輸入 - 所以它成爲一個隱藏的技巧來過濾它（更不用說，Firefox幾乎會做正確的反正）。

您可以輕鬆地將圖像投射到文本框旁邊，以指示它具有選項，這允許鼠標驅動或鍵盤驅動的交互。

我偏愛JQuery，所以我會使用JQuery's autocomplete - 它具有配置選項以要求匹配，或者單擊該框將會下拉所有項目。

如果您對「漸進式增強」感興趣，那麼您最好使用傳統的選擇輸入（用於輔助功能），將被自動完成文本框替換爲。喜歡的東西：

<select id="s"> 
    <option value="foo">Foo</value> 
    <option value="bar">Bar</value> 
</select> 

var d = $('#s OPTION').map(function() { 
    return $(this).text(); 
}); 

$('#s').hide().append('<input type="text" />') 
    .autocomplete(d, { 
     mustMatch: true, 
     minChars: 0, 
     autoFill: true, 
     matchContains: false 
    }) 
    .result(function(e, d, f) { 
     // Select option for the form to submit 
     $('#s').val(d); 
    });

你也可以離開選擇可見的 - 這使得它更靈活，但可能更混亂 - 和掛鉤的事件處理程序的選擇框來更新文本框，以及使他們保持同步。

來源

2009-08-29 22:35:14

爲用戶提供過濾下拉列表的搜索功能

回答

相關問題