はじめに
jQuery Select2 で、選択肢に存在しない情報を動的に追加する方法を調べた。
ユーザー入力で一致する選択肢がある場合は既存選択肢を、そうでなければユーザー入力をそのまま選択肢として追加する、というイメージ。
TL;DR
tags: trueを指定すると選択肢を動的に追加できるcreateTagで選択肢追加時の挙動を制御できるmultipleの場合は複数選択しを追加できる
jQuery Select2 で、選択肢に存在しない情報を動的に追加する方法を調べた。
ユーザー入力で一致する選択肢がある場合は既存選択肢を、そうでなければユーザー入力をそのまま選択肢として追加する、というイメージ。
tags: true を指定すると選択肢を動的に追加できるcreateTag で選択肢追加時の挙動を制御できるmultiple の場合は複数選択しを追加できるjQuery Select2 で、ajax で選択肢を取得する方法方法を調べた。
ajax オプション内で設定url, data オプションで API Request に関する設定processResults オプションで API Response を受信した後の処理templateResult, templateSelection オプションで見た目(HTML)の設定jQuery Select2 で、複数選択(multiple)を有効にした場合の、最大選択可能数を設定する方法を調べた。
$('xx').select2({maximumSelectionLength: n}) で最大選択可能数を設定できるmultiple は <select multiple> でも、select2({multiple: "multiple"}) でも良いlanguage: maximumSelected でメッセージをカスタマイズできるjQuery Select2 で、初期値を設定する方法と、クリアをする方法を調べた。
$('#mySelect2').val("val").trigger('change'); で初期化multiple なら $('#mySelect2').val(["val1", "val2", ...]).trigger('change');$('#mySelect2').val(null).trigger('change'); でクリア