複数選択、通常のselectタグをmultipleにすれば選択可能ですが、あまりかっこよくないです。
1<select name="list" size="10" multiple>
2<option value="1">選択肢1</option>
3<option value="2">選択肢2</option>
4<option value="3">選択肢3</option>
5<option value="4">選択肢4</option>
6<option value="5">選択肢5</option>
7</select>
そこでDual Listboxです。
こちらはBootstrapベースのコントロールで、左右に並んだリストがあって選択済みを右側のリストに入れていくようなコントロールです。
1<select name="list2" id="duallistbox" size="10" multiple>
2<option value="1">選択肢1</option>
3<option value="2">選択肢2</option>
4<option value="3">選択肢3</option>
5<option value="4">選択肢4</option>
6<option value="5">選択肢5</option>
7</select>
8
9<script>
10$(document).ready(function(){
11 $("#duallistbox").bootstrapDualListbox({
12 });
13});
14</script>
右側が選択済みのリストです。通常のselectタグだとctrlやcmdを押しながらクリックしてないといけないですが、DualListboxだとクリックだけで追加削除ができます。
その他一括追加や絞り込みなどいろいろな機能を必要に応じて有効にできます。
