web-dev-qa-db-ja.com

6000以上の値を持つドロップダウンの代替

ユーザーがログインするストアの場所の名前を選択する必要があるログインフォームでは、最大6000個の値が存在する可能性があります。 5から10の場所しかない会社の場合、ドロップダウンは適切に機能します。

ドロップダウンを使用して最大6000の場所で使用できるようにするための良い代替手段は何ですか?

6
Steve Jones

数十を超えるオプションの選択リストの場合、オートコンプリートをサポートするフリーテキスト検索が唯一の正気なオプションです。

これは、不動産サイト(Zillow、Redfinなど)や旅行サイト(AirBnb、カヤック、その他の航空会社など)で見られる一般的なパターンです。

Kayak Autocomplete

Fred Meyer(大手小売店)は、これを解決するために「Select Store」検索ボックスを備えています。Zipまたは都市で絞り込みを要求すると、一致する長いリストが表示されます。オートコンプリート付きのフリーテキストの方がはるかに優れたエクスペリエンスですが、エンジニアリングコストが制限である場合、これはオプションになる可能性があります。 https://www.fredmeyer.com/

Fred Meyer Find Stores

上記に掲載されたDusBeastoのデュープも、優れた完全な回答を提供します。

18
mahalie

@ -DasBeastoの answer linked で述べたように、適切な解決策はオートコンプリートテキストフィールドです。ユーザーは場所の名前の入力を開始するだけでよく、テキストボックスはそれをフィルタリングし始めます。

ただし、これが実際に機能するのは、この場所が正確にどこにあるかをすでに知っているユーザーのみです。ユーザーが純粋に別の場所(郵便番号、自宅の住所など)の近さによって場所を検索している場合、このアプローチは崩れます。より適切な解決策は、ユーザーに郵便番号、州、または都市の入力を求め、その地点に最も近い場所を提示することです。これの一般的な使用法は、位置を空間的に表すマップをユーザーに提示することです。

2
JonBee