IT系情報を中心に調べた事をコツコツ綴っています。Widget」の使用方法ツイートHTML標準のリストボックスで複数選択可能とする場合にはmultiple属性を指定して実装しますが、HTML標準のままでは複数選択する場合にctrlキーを押下したまま選択する必要があるので慣れていない方には操作しにくい面があります。Widget」を使用すると操作性が劇的に向上します。複数選択式のリストボックス(ドロップダウン)をチェックボックス+リストボックス(ドロップダウン)形式に変換して操作性を劇的に向上してくれます。UIと組み合わせて利用するプラグインです。UIのダウンロードページにアクセスします。All」にチェックが付いているので、チェックを外して今回必要な「Core」と「Widget」へチェックして「Download」ボタンを押下します。※デザインを変更したい場合はページ下にある「Theme」でタブのデザインも選択可能です。lightness」を選択しています。Widget」をダウンロードします。⇒https://github.com/ehynds/jquery-ui-multiselect-widgetダウンロードしたファイルの内、必要となるのは以下の通りです。基本的にmultiselectメソッドを実行すればOKですが、オプションを指定する事でカスタマイズする事も可能です。All」、「x」(閉じる)ボタンが表示されます。All」、「x」(閉じる)ボタンが表示されません。文字列を指定:指定した文字列が表示されます。All」、「x」(閉じる)ボタンは表示されません。px単位でのチェックボックスコンテナ(スクロール領域)の高さを指定します。px単位で全体のウィジェットの最小幅を指定します。「auto」に設定すると無効になります。all」ボタンのテキスト内容を指定します。All」ボタンのテキスト内容を指定します。チェックボックスが一つも選択されていない場合のテキスト内容を指定します。オプションが選択されている場合、シャープ記号(#)が自動的に選択されたチェックボックスの数に置換されます。メニューを開く時に適用する効果を指定します。メニューが閉じる時に適用する効果を指定します。true:ウィジェットの初期化時に自動的にメニューが開きます。flase:ウィジェットの初期化時に自動的にメニューは開きません。true:チェックボックスが表示され、複数選択可能となります。false:チェックボックスが非表示となり1つのみ選択可能となります。カスタマイズする為にボタンとメニューの両方に適用するための追加クラスを指定します。ドロップダウンメニューの表示位置を配置することができます。適用後)項目1項目2項目3項目4項目5項目6項目7上記リストで複数選択した値を取得する場合は、従来のリストボックスで複数選択した値を取得する手法と同様の手段で取得可能となります。コメントをキャンセルメールアドレスが公開されることはありません。