#javascript #html #jquery #twitter-bootstrap
#javascript #HTML #jquery #twitter-bootstrap
Вопрос:
Я добавил 2 выпадающих списка bootstrap multi select на свою HTML-страницу.
#drop1
<select multiple data-style="bg-white rounded-pill px-4 py-3 shadow-sm " class="selectpicker w-100"
id="drop1" data-actions-box="true">
<option>Val1</option>
<option>Val2</option>
<option>Val3</option>
</select>
#drop2
<select multiple data-style="bg-white rounded-pill px-4 py-3 shadow-sm " class="selectpicker w-100"
id="drop2" data-actions-box="true">
<option>Val11</option>
<option>Val22</option>
<option>Val33</option>
</select>
Здесь я установил для ‘data-actions-box’ значение true, чтобы включить опцию Выбрать все и отменить выбор всех в моем выпадающем списке.
Когда я нажимаю на опцию выбрать все, она работает нормально.Я хочу переключить кнопку как выбрать все и отменить выбор всех.
Для реализации указанной вещи мне пришлось добавить следующее событие на мою страницу
$(".bs-select-all").on('click', function () {
$(".bs-deselect-all").css({
"display": "block"
});
$(".bs-select-all").css({
"display": "none"
});
});
$(".bs-deselect-all").on('click', function () {
$(".bs-select-all").css({
"display": "block"
});
$(".bs-deselect-all").css({
"display": "none"
});
});
Здесь bs-select-all — это имя класса кнопки выбрать / отменить выбор всего, используемой в bootstrap multiselect (я нашел его в bootstrap-select.js файл).Но проблема в том, что когда я нажал на кнопку Выбрать все в первом выпадающем списке, обе кнопки выпадающего списка изменились на отмену выбора всех.