jquery - 引导多选（刷新）无法正常工作

Question

我正在使用引导多选列表框。当用户在多选上选择选项时，它会正确显示。但是有一个选项可以重置以前选择的选项。当用户单击重置按钮时，会自动style=display:none添加到下拉按钮，并且下拉列表变得不可见。

这是我的代码

$("#button").click(function () {

    $('option', $('.multiselect')).each(function (element) {
        $(this).removeAttr('selected').prop('selected', false);

    });
    $('.multiselect').multiselect('refresh');
});

score 55 · Accepted Answer

其他有用的选项是：

$('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

score 6 · Accepted Answer

如果您只是以这样的类为目标，则 Bootstrap Multiselect 会失败。

$(".multiselect").multiselect("refresh");

发生这种情况是因为插件中有其他东西具有“多选”类。你必须让它知道，它只是你想要定位的选择。

以下对我有用。

$("select.multiselect").multiselect("refresh");

“取消选择”方法也同样重要。

$("select.multiselect").multiselect("deselectAll", false);

score 5 · Accepted Answer

我的方法是销毁多选，然后重新初始化它。这对我有用。试试看：

    function initMultiSelect(){

      $('#yourMultiselectId').multiselect({
        includeSelectAllOption: true,
        selectAllValue: 'select-all-value'
      });
    }


    $('#button').click(function(e){
        e.preventDefault();
        $('#yourMultiselectId').multiselect('destroy');
        initMultiSelect();
    });

score 2 · Accepted Answer

看看这个文档：http ://davidstutz.github.io/bootstrap-multiselect/

要取消选择一个选项，请使用此

$('.multiselect').multiselect('deselect', value)

然后调用刷新方法

$('.multiselect').multiselect('refresh');

score 0 · Accepted Answer

$("#selectedVariables option:selected").prop("selected",false);
$("#selectedVariables option").remove();
$('#selectedVariables').multiselect('rebuild');

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>

score 0 · Accepted Answer

$('option', "#id").each(function(element) {
  jQuery("#id").multiselect('deselect', $(this).val());
});

我已成功取消选择先前选择的选项。

jquery - 引导多选（刷新）无法正常工作

6 回答 6

Related

Reference