バックグラウンド
ユーザーがソース リストをフィルタリングできる jQuery または JavaScript ベースのコンボボックス シャトル ウィジェットを探しています。ソース リストはコンボ ボックス (左側) で、宛先リストは 2 番目のコンボ ボックス (右側) です。
モックアップ
ウィジェットは次のようになります。
既存の jQueryウィジェット:
使用法
ユーザーは次のことができます。
- ソースリストをフィルタリングするための正規表現を入力します (例:
Toy.*)。- ウィジェットは、フィルター式に一致しないすべてのアイテムを非表示にします。
- ソース リストで 1 つまたは複数のアイテムを選択します (クリック、Ctrl キーを押しながらクリック、または Shift キーを押しながらクリックして選択します)。
- をクリックして
>>、ソース リストから宛先リストにアイテムを転送します。 - フィルターをクリアして、完全なソース リストを表示します。
テクニカル
理想的には、コンボボックスは複数選択の HTML コンボボックスを使用し、マークアップは簡単です:
<select name="sourceList" id="sourceList" size="20" multiple="multiple">
<option value="1">Toyota</option>
<option value="2">Mitsubishi</option>
<option value="3">Nintendo</option>
<option value="4">Samsung</option>
<option value="5">Bank of Kyoto</option>
</select>
<select name="destinationList" id="destinationList" size="20" multiple="multiple">
<option value="6">Mazda</option>
<option value="7">Fuji</option>
<option value="8">Honda</option>
</select>
<script>
$('#sourceList').shuttle();
</script>
所見
これらは近いです：
- http://archive.plugins.jquery.com/project/crossSelect - フィルターなし
- http://quasipartikel.at/multiselect/ - 複数選択は許可されていません
- http://blog.jeremymartin.name/2008/02/easy-multi-select-transfer-with-jquery.html - フィルターなし
- http://davidwalsh.name/demo/multi-select.php - MooTools を使用します。フィルターなし
- http://devblog.jasonhuck.com/assets/comboselect/ - フィルターなし
- http://www.dhtmlgoodies.com/index.html?whichScript=multiple_select - フィルタなし
- http://blog.cbolson.com/expanding-multiple-select-list-with-search-filter/ - MooTools
これらはほぼ完璧です:
- https://github.com/rabihkodeih/bootstrap-transfer -
div(代わりに) タグを使用します<select>か? - http://www.senamion.com/blog/jmultiselect2side.html - 正規表現検索なし
- http://mind2soft.com/labs/jquery/multiselect/ - 正規表現検索なし
3000 から 5000 の項目のカテゴリの割り当てをバッチ処理しようとしていますが、これがそのような偉業を達成するための迅速な方法であると考えました。(日本の会社名は純粋に架空のものです。実際には、名前には通常、共通の単語または語句があります。)
質問
これらの要件を満たす無料のオープン ソース ウィジェット (jQuery または純粋な JavaScript) は何ですか?
関連している
関連リンク：