bootstrap multiselectリストボックスを使用しています。ユーザーが複数選択のオプションを選択すると、それが正しく表示されます。しかし、以前に選択したオプションをリセットするオプションがあります。リセットボタンをクリックすると、自動的にstyle=display:none
がドロップダウンボタンに追加され、ドロップダウンリストが非表示になります。
これは私のコードです
$("#button").click(function () {
$('option', $('.multiselect')).each(function (element) {
$(this).removeAttr('selected').prop('selected', false);
});
$('.multiselect').multiselect('refresh');
});
その他の役立つオプションは次のとおりです。
$('Id').multiselect('refresh');
-選択の選択されたオプションに基づいて複数選択を更新します。
$('Id').multiselect('destroy');
-プラグイン全体をアンバインドします。
buildFilter
:フィルターを構築します。
buildSelectAll
:すべてを選択します。すべて選択がすでに作成されているかどうかを確認します。
$('Id').multiselect('select', ['1', '2', '4']);
-指定された値のすべてのオプションを選択します。
clearSelection
:選択したすべてのアイテムをクリアします。
$('Id').multiselect('deselect', ['1', '2', '4']);
-指定された値のすべてのオプションを選択解除します。
$('Id').multiselect('selectAll', true);
-有効で表示されているすべてのオプションを選択します。
$('Id').multiselect('deselectAll', true);
-すべてのオプションを選択解除します。
$('Id').multiselect('rebuild');
-プラグインを再構築します。
$('Id').multiselect('enable');
-複数選択を有効にします。
$('Id').multiselect('disable');
-複数選択を無効にします。
hasSelectAll
:すべて選択チェックボックスが存在するかどうかを確認します。
updateSelectAll
:現在表示および選択されているチェックボックスに基づいて、すべて選択チェックボックスを更新します。
$('Id').multiselect('updateButtonText');
-現在選択されているオプションに基づいて、ボタンのテキストとそのタイトルを更新します。
getSelected()
:選択したすべてのオプションを取得します。
getOptionByValue()
:値によって選択オプションを取得します。
$('Id').multiselect('dataprovider', options);
-提供されたデータは、ドロップダウンを構築するために使用されます。
詳細については bootstrap-multiselect をご覧ください
このようなクラスをターゲットにしただけでは、Bootstrap Multiselectは失敗します。
$(".multiselect").multiselect("refresh");
これは、クラス「multiselect」を持つプラグインに他に何かがあるために起こります。それはあなたがターゲットにしたい選択だけであることをあなたに知らせなければなりません。
以下は私のために働いた。
$("select.multiselect").multiselect("refresh");
「選択解除」メソッドでも同じことが言えます。
$("select.multiselect").multiselect("deselectAll", false);
このドキュメントを見てください: http://davidstutz.github.io/bootstrap-multiselect/
オプションの選択を解除するには、これを使用します
$('.multiselect').multiselect('deselect', value)
次に、refreshメソッドを呼び出します。
$('.multiselect').multiselect('refresh');
私のアプローチは、複数選択を破棄し、それを再初期化することです。それでうまくいきました。試してみる:
function initMultiSelect(){
$('#yourMultiselectId').multiselect({
includeSelectAllOption: true,
selectAllValue: 'select-all-value'
});
}
$('#button').click(function(e){
e.preventDefault();
$('#yourMultiselectId').multiselect('destroy');
initMultiSelect();
});