jQuery 引导多选(刷新)无法正常工作

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/25750253/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 11:09:50  来源:igfitidea点击:

bootstrap multiselect(refresh) is not working properly

jquerytwitter-bootstrapbootstrap-multiselect

提问by user3408779

I am using bootstrap multiselect list box. When user selects options on the multiselect it shows correctly. But there is a option to reset the previously selected options. When user click on reset button, automatically style=display:noneis adding to the dropdown button and the dropdown list is becomes invisible.

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

This is my code

这是我的代码

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

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

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

回答by 2787184

Other helpful options are:

其他有用的选项是:

  1. $('Id').multiselect('refresh');- Refreshs the multiselect based on the selected options of the select.

  2. $('Id').multiselect('destroy');- Unbinds the whole plugin.

  3. buildFilter:Builds the filter.

  4. buildSelectAll: Build the selct all.Checks if a select all has already been created.

  5. $('Id').multiselect('select', ['1', '2', '4']);- Select all options of the given values.

  6. clearSelection: Clears all selected items.

  7. $('Id').multiselect('deselect', ['1', '2', '4']);- Deselects all options of the given values.

  8. $('Id').multiselect('selectAll', true);- Selects all enabled & visible options.

  9. $('Id').multiselect('deselectAll', true);- Deselects all options.

  10. $('Id').multiselect('rebuild');- Rebuild the plugin.

  11. $('Id').multiselect('enable');- Enable the multiselect.

  12. $('Id').multiselect('disable');- Disable the multiselect.

  13. hasSelectAll: Checks whether a select all checkbox is present.

  14. updateSelectAll: Updates the select all checkbox based on the currently displayed and selected checkboxes.

  15. $('Id').multiselect('updateButtonText');- Update the button text and its title based on the currently selected options.

  16. getSelected(): Get all selected options.

  17. getOptionByValue(): Gets a select option by its value.

  18. $('Id').multiselect('dataprovider', options);- The provided data will be used to build the dropdown.

  1. $('Id').multiselect('refresh');- 根据选择的选定选项刷新多选。

  2. $('Id').multiselect('destroy');- 解除整个插件的绑定。

  3. buildFilter:构建过滤器。

  4. buildSelectAll: 构建全选。检查是否已经创建全选。

  5. $('Id').multiselect('select', ['1', '2', '4']);- 选择给定值的所有选项。

  6. clearSelection:清除所有选定的项目。

  7. $('Id').multiselect('deselect', ['1', '2', '4']);- 取消选择给定值的所有选项。

  8. $('Id').multiselect('selectAll', true);- 选择所有启用和可见的选项。

  9. $('Id').multiselect('deselectAll', true);- 取消选择所有选项。

  10. $('Id').multiselect('rebuild');- 重建插件。

  11. $('Id').multiselect('enable');- 启用多选。

  12. $('Id').multiselect('disable');- 禁用多选。

  13. hasSelectAll:检查是否存在全选复选框。

  14. updateSelectAll:根据当前显示和选定的复选框更新全选复选框。

  15. $('Id').multiselect('updateButtonText');- 根据当前选择的选项更新按钮文本及其标题。

  16. getSelected():获取所有选定的选项。

  17. getOptionByValue():通过其值获取选择选项。

  18. $('Id').multiselect('dataprovider', options);- 提供的数据将用于构建下拉列表。

for more detail visit bootstrap-multiselect

有关更多详细信息,请访问bootstrap-multiselect

回答by Thylle

Bootstrap Multiselect fails if you just target the class like this.

如果您只针对这样的类,Bootstrap Multiselect 将失败。

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

This happens because there is something else in the plugin that has the class "multiselect". You have to let it know, that it is only the select's you want to target.

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

The following worked for me.

以下对我有用。

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

The same counts for the "deselect" method.

“取消选择”方法的计数相同。

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

回答by omargarcianet

My approach is to destroy the multiselect and then reinitialize it. That worked for me. Give it a try:

我的方法是销毁多选,然后重新初始化它。那对我有用。试一试:

    function initMultiSelect(){

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


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

回答by Sam Battat

Look at this documentation: http://davidstutz.github.io/bootstrap-multiselect/

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

To deselect an option use this

要取消选择一个选项,使用这个

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

Then call the refresh method

然后调用refresh方法

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