web-dev-qa-db-ja.com

長いリストから多数のアイテムを選択するための二重リストの代替ですか?

デュアルリストではなく、長いアイテムリストから一連のアイテムを選択するための選択肢と例はありますか?

この質問には、従来のデュアルリストにいくつかの素晴らしい拡張機能がありますが、他に考慮すべき点を探しています。

長いリストの項目のサブセットを選択する最良の方法

16
Sam

トークン付きの複数選択の使用を検討してください設計。入力時のフィルター機能は便利ですが、必須ではありません。これらは、一般的なユースケースで1つまたはいくつかを選択する場合にうまく機能しますが、ユーザーが各アイテムのメニューを再度呼び出す必要があるため、多数を選択する必要がある場合、使いやすさがすぐに低下します。

Multi-select with tokens, via harvesthq.github.com/chosen

これまでに、電子メールクライアントでトークン化された複数入力メソッドを見てきました。 multi-select-tokens in email

一般的なケースが複数選択する場合は、チェックボックスメニューを検討できます。ここでの違いは、ドロップダウンが複数のクリックにわたって持続する(さらに、複数選択の性質を視覚的に伝える)ため、ユーザーはクリック、クリック、クリックして複数のアイテムをすばやく選択できることです。私たちのウェブアプリでは、トークン機能を追加することでこのデザインを強化しようとしています。

checkbox menu, via realestate.com.au

11
Erics

代替手段は、データと予想されるユースケースによって異なります。視覚的な表現は、ユーザーが正しい値を見つけるのを助けるほど重要ではありません。オプションの数を減らし、ユーザーを適切な値に導くために、あらゆる機会を利用する必要があります。以前の選択をフィルタリング、グループ化、および記憶することを検討してください。

3
Nescio

Windows 7でWindowsエクスプローラーの列を選択するために使用されるこの代替案に気づきました。

enter image description here

2
jpierson

これらの例も確認してください。

http://ivaynberg.github.com/select2/

...プログラムによるアクセス、タグ付けのサポート、選択ボックス、入力フィールド、ドロップダウンなどのトークン化を提供する「Select 2」と呼ばれるjqueryプラグインから。これであなたの挑戦のための良い解決策を構築することができるはずです。

クールなプラグイン。

2
Rowe Morehouse

上部にある[すべて選択]チェックボックスオプションを備えたチェックボックスリストを使用できます。このチェックボックスを使用すると、すべてのオプションをすばやく選択および選択解除できます(チェックボックスは、リストの選択ステータスを同時に反映します...すべて、任意、またはなし)。チェックボックス項目の数が非常に多い場合は、選択した項目を(通常のリストで)チェックボックスリストの右側に表示できます。さらに、チェックボックスリストにフィルターを追加する必要があります。

0
sysscore

スペースが足りず、アイテムが追加される可能性が低い場合(2〜3)、繰り返し追加アクションを実行できます。適切な分類法を使用すると、ユーザーはそれを非常に速く取得できます。

0
Bobby Tables