jquery 单击SelectAllOption多选时未触发onChange事件

yk9xbfzb 于 2023-03-01 发布在 jQuery

关注(0)|答案(3)|浏览(179)

我已经使用bootstrap multiselect，获取数据的基础上选择的选项。这个过滤器的数据将工作时，onChange触发，但当试图选择所有onChange不工作：

function getOptions(node, isFilter) {
    var isChanged = false;
    return {
        enableCaseInsensitiveFiltering: isFilter,
        includeSelectAllOption: true,
        filterPlaceholder: 'Search ...',
        nonSelectedText: node,
        numberDisplayed: 1,
        buttonWidth: '100%',
        maxHeight: 400,
        onChange: function () {
            alert('Changes');
            isChanged = true;
        },
        onDropdownHide: function (event) {
            if (isChanged) {
                filterData(node);
                isChanged = false;
            }

        }
    }
}
$('#myselect').multiselect(getOptions('myselect', true));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-multiselect/0.9.13/js/bootstrap-multiselect.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-multiselect/0.9.13/css/bootstrap-multiselect.css" />
<!-- Build your select: -->
<select id="myselect" multiple="multiple">
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
    <option value="3">Option 3</option>
    <option value="4">Option 4</option>
    <option value="5">Option 5</option>
    <option value="6">Option 6</option>
</select>

jquery

来源：https://stackoverflow.com/questions/45344156/onchange-event-not-triggered-when-while-clicking-on-selectalloption-multiselect

3条答案

按热度按时间

dfty9e191#

Bootstrap 多选提供了一个名为“onSelectAll”的函数。此函数将用于全选选项。您需要将onSelectAll函数与onChange函数一起使用。

function getOptions(node, isFilter) {
var isChanged = false;
return {
    enableCaseInsensitiveFiltering: isFilter,
    includeSelectAllOption: true,
    filterPlaceholder: 'Search ...',
    nonSelectedText: node,
    numberDisplayed: 1,
    buttonWidth: '100%',
    maxHeight: 400,
    onChange: function () {
        isChanged = true;
    },
    onSelectAll: function() {
        isChanged = true;
    },
    onDropdownHide: function (event) {
        if (isChanged) {
            filterData(node);
            isChanged = false;
        }

    }
}
}
$('#DDLCity').multiselect(getOptions('City', true));

赞(0）回复(0）举报 2023-03-01

ycl3bljg2#

Bootstrap multiselect为此提供了一个事件，那就是onSelectAll。在检查Select all时，您需要使用onSelectAll。以下是您的代码中缺少的代码片段：

onSelectAll: function() {
    alert("SELECT ALL");
    isChanged = true;
},

下面是代码的更新工作版本：
x一个一个一个一个x一个一个二个x

赞(0）回复(0）举报 2023-03-01

4dc9hkyq3#

要激发“全选”选项的事件，可以用途：

$('#example-onSelectAll').multiselect({
   includeSelectAllOption: true,
   onSelectAll: function(options) {
       alert('onSelectAll triggered, ' + options.length + ' options selected!');
   }
});

对于“取消全选”选项，您可以用途：

$('#example-onDeselectAll').multiselect({
    includeSelectAllOption: true,
    onDeselectAll: function(options) {
        alert('onDeselectAll triggered, ' + options.length + ' options deselected!');
    }
});

参考：引导多选

赞(0）回复(0）举报 2023-03-01

我来回答

jquery 单击SelectAllOption多选时未触发onChange事件

3条答案

相关问题

热门标签

最新问答