Я использую bootstrap's multiselect с enableCollapsibleOptGroups
установлен в true.Как я могу сделать групповые групповые групповые опрокидывания по умолчанию?
Что я сейчас:
Я хочу иметь optgroups свернутые по умолчанию:
Я использую bootstrap's multiselect с enableCollapsibleOptGroups
установлен в true.Как я могу сделать групповые групповые групповые опрокидывания по умолчанию?
Что я сейчас:
Я хочу иметь optgroups свернутые по умолчанию:
Давида не работает для меня. Но эти два решения работали:
Решение 1:
buttonContainer: '<div id="example-enableCollapsibleOptGroups-collapsed-container" />',
onDropdownShown: function() {
$('#example-enableCollapsibleOptGroups-collapsed-container .caret-container').click();
},
onDropdownHidden: function() {
$('#example-enableCollapsibleOptGroups-collapsed-container .caret-container').click();
}
Решение 2:
buttonContainer: '<div id="example-enableCollapsibleOptGroups-collapsed-container" />'
Тогда:
setTimeout(function(){
$('#example-enableCollapsibleOptGroups-collapsed-container .caret-container').click();
} , 2000);
Я добавил простой пример для этого здесь: http://davidstutz.github.io/bootstrap-multiselect/#configuration-options-enableCollapsibleOptGroups.
Уловка запуская событие щелчка для каждой группы сразу же после загрузки страницы: ответ
<script type="text/javascript">
$(document).ready(function() {
$('#example-enableCollapsibleOptGroups-collapsed').multiselect({
enableCollapsibleOptGroups: true,
buttonContainer: '<div id="example-enableCollapsibleOptGroups-collapsed-container" />'
});
$('#example-enableCollapsibleOptGroups-collapsed-container .caret-container').click();
});
</script>
<select id="example-enableCollapsibleOptGroups-collapsed" multiple="multiple">
<optgroup label="Group 1">
<option value="1-1" disabled>Option 1.1</option>
<option value="1-2" selected="selected">Option 1.2</option>
<option value="1-3" selected="selected">Option 1.3</option>
</optgroup>
<optgroup label="Group 2">
<option value="2-1">Option 2.1</option>
<option value="2-2">Option 2.2</option>
<option value="2-3">Option 2.3</option>
</optgroup>
</select>
Я придумал разные решение, которое хорошо работает для m е.
HTML:
<div id="multiselect-filter-dropdown-wrapper">
<label id="multiselect-filter-dropdown-label">Filter:</label>
<select multiple id="multiselect-filter-dropdown"></select>
</div>
JS:
$('#multiselect-filter-dropdown').multiselect({
enableCollapsibleOptGroups: true
}); //init with required options
$('#multiselect-filter-dropdown').multiselect('dataprovider', multiselectFilterDataProvider); //populate with required data
$('#multiselect-filter-dropdown-wrapper ul.multiselect-container li:not(.multiselect-all):not(.multiselect-group)')
.hide()
.addClass('multiselect-collapsible-hidden'); //collapse required opt groups
Не работает. Я должен был сделать это onDropdownShown/onDropdownHidden. Другим решением было сделать это через 2 секунды, например: setTimeout (function() { $ ('# example-enableCollapsibleOptGroups-collapsed-container .caret-container'). Click(); }, 2000); – Aboelseoud
Спасибо за помощь в любом случае! – Aboelseoud
Вы проверили пример, приведенный в документации (http://davidstutz.github.io/bootstrap-multiselect/#configuration-options-enableCollapsibleOptGroups)? Ключом к этому примеру является '$ (document) .ready (function() {...});', поскольку страница должна сначала загружаться. –