キーワードフィルタリング

リスト内の項目から、任意のキーワードにマッチするものだけを抽出できるように、検索用のテキストボックスを用意する。
理由:自由入力による検索で柔軟にフィルタリングができるようにするため。

図例
を用いたキーワードフィルタリング

効能

  • あらかじめ用意されたフィルタリング条件を使うのではなく、任意のキーワードを条件にして自由に絞り込みができる。
  • リスト表示するオブジェクトの属性のいくつかについて、その値が無限にあり、フィルタリング条件を選択肢として用意できない場合でも、ユーザーが絞り込み操作を行うことができる。
  • リスト表示するオブジェクトのある属性値全体ではなく、属性値の一部(例えばEメール本文の一部)に含まれる語句を検索してリストをフィルタリングするような用途に使える。

用法

  • リストの左上に、シンプルな検索用テキストボックスを1つ配置する。入力されたキーワードでリスト内項目の属性値を検索する。
  • 十分なレスポンススピードが得られる場合にはを行い、リアルタイムにリスト内を更新する。
  • レスポンスに問題がある場合や、サーバーの負荷が過剰になる場合には、インクリメンタルサーチは行わず、ボタンを配置して、ユーザーが任意のタイミングで検索を実行するようにする。
  • フィルタリングされた状態からデフォルトの表示状態に戻すためのトリガーを用意する。例えばインクリメンタルサーチを用いる場合には、小さな「×」ボタンをテキストボックスの右に配置する(その場合、検索実行ボタンに見えないように注意する必要がある)。またテキストボックス内の文字列を消去した場合にもデフォルト表示に戻るようにする。一方検索ボタンを配置する場合は、トリガーとして「全件表示」といったボタンを検索ボタンの右に配置する。またテキストボックスを空欄にして検索ボタンを押すことでも表示をデフォルトに戻せるようにする。
  • 必要に応じて、を併用してもよい。

図例
ボタンのあるキーワードフィルタリング

図例
を併用したキーワードフィルタリング