incsearch.js

サンプル2：テーブル表示のサンプル

incsearch.js(IncSearch.ViewTable)を使った、テーブルからインクリメンタルサーチを行う簡単なサンプルです。

incsearch.jsの説明は、「incsearch.js - インクリメンタルサーチライブラリ」を参照ください。

---

サンプル

下記に入力すると、一覧から部分一致で検索し、一致する列を表示します。(スペース区切りで複数入力可)

※オプションで大文字・小文字を区別して検索するように指定しています。

  

---

サンプルの内容

new IncSearch.ViewTable(
  'text',      // 入力が行われるエレメントのID
  'view_area', // 検索結果を表示するエレメントのID
  list,        // 検索対象のリスト
  {
    dispMax: 10,  // オプション
    startElementText: '<table><tr><th width="30%">言語</th><th width="70%">フレームワーク・ライブラリ</th>',
    ignoreCase: false
  }
);

• テーブル表示(IncSearch.ViewTable)のサンプルです。
• オプション(dispMax)により、表示件数を10件までにしています。
• オプション(ignoreCase:false)により、大文字／小文字を区別して検索されます。
• オプション(startElementText)にて、テーブルのヘッダ部分を指定しています。