bootstrap multiselect - 单击即可取消选中/取消选中所有选项

Question

我正在使用Bootstrap multiselect,我想添加一个选项来取消选中所有选定的选项.请为我提供相同的解决方案.谢谢你的帮助 :)

Answer 1

您可以使用此处文档中.multiselect('refresh')提到的方法.bootstrap-multiselect

因此,在多选选择列表旁边添加一个HTML按钮/图标,然后使用以下代码:

$("#reset_client").click(function(){
  $('option', $('#select_client')).each(function(element) {
    $(this).removeAttr('selected').prop('selected', false);
  });
  $("#select_client").multiselect('refresh');
});

<select name="clients[]" multiple="multiple" id="select_client" style="display: none;">
    <option value="multiselect-all"> Select all</option>
    <option value="1">Client 1</option>
    <option value="2">Client 2</option>
    <option value="3">Client 3</option>
    <option selected="selected" value="4">Client 4</option>
    <option selected="selected" value="5">Client 5</option>
    <option value="6">Client 6</option>
    <option selected="selected" value="7">Client 7</option>
    <option value="8">Client 8</option>
</select>

<input type="button" value="Reset" name="reset_clients" id="reset_client" class="reset_button" title="Clear Selection">

Answer 2

使用下面的代码取消选择多选引导下拉列表中的所有选择项

$("#ddlMultiSelectId").multiselect('clearSelection');

Answer 3

您可以包含"全选"按钮,按两次将"取消全选"按钮.为此,请添加以下选项:

includeSelectAllOption:true

这将基于select元素选择所有引导多选.

function multiselect_deselectAll($el) {
    $('option', $el).each(function(element) {
        $el.multiselect('deselect', $(this).val());
    });
}

$('.multiselect').each(function() {
    var select = $(this);
    multiselect_deselectAll(select);
});

您可以手动添加一个选项"全部选择",然后在按下时调用重置功能.

请参阅:https: //github.com/davidstutz/bootstrap-multiselect/issues/271

Answer 4

您可以使用"deselectAll"方法执行此操作.

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

重要的是你告诉jQuery只针对你的"选择",否则它将失败.这是因为插件添加了具有相同类名的其他内容.

@ L_7337 - 这不是您链接的帖子的副本.如果您使用Bootstrap Multiselect,这篇文章是关于如何取消选择所有选项

另一篇文章是如何从正常的多选项中取消选择.

最好的问候Rasmus

Answer 5

尝试这个

$("option:selected").prop("selected", false)