顯示選中bootstrap-multiselect中的所有複選框並自定義「無選定」文本

Question

我正在尋找解決方案，將無選定標籤更改爲自己的文本。

我有這樣的代碼， HTML：

<select id="mySelect" multiple="multiple">   
    <optgroup label="MODERN" value="MODERN"> 
     <option value="paintings">FAMES</option> 
     <option value="works on paper">WORKS</option> 
     <option value="prints">LIFE</option> 
     <option value="sculptures">TIME</option> 
     <option value="design">DESIRE</option> 
     <option value="photography">FUTURE</option> 
    </optgroup> 
</select> 
<select id="mySelect2" multiple="multiple">   
    <optgroup label="TREND" value="TREND"> 
     <option value="paintings">FAMES</option> 
     <option value="works on paper">WORKS</option> 
     <option value="prints">LIFE</option> 
     <option value="sculptures">TIME</option> 
     <option value="design">DESIRE</option> 
     <option value="photography">FUTURE</option> 
    </optgroup> 
</select> 

JS：

$(function() { 
    $('#mySelect').multiselect({ 
     enableClickableOptGroups: true 
    }); 
    $('#mySelect2').multiselect({ 
     enableClickableOptGroups: true 
    }); 
}); 

我想提出的 '無選擇' 文字到現代，並在同一時間，我希望全選選項包含在複選框中。

任何人都可以給我一些想法如何做到這一點？

Answer 1

嗨如果你想選擇所有複選框爲這個控制，那麼你可以使用下面的代碼。您可以使用nonSelectedText屬性來更改「無選定」文本

$(function() { 
$('#mySelect').multiselect({ 
    enableClickableOptGroups: true, 
    includeSelectAllOption:true, 
    nonSelectedText: 'MODERN' 
}); 
$('#mySelect2').multiselect({ 
    enableClickableOptGroups: true 
    includeSelectAllOption:true 
}); 

}）;

Answer 2

在HTML

<select id="mySelect" multiple="multiple">   
    <optgroup label="MODERN" value="MODERN" stat="0"> 
     <option value="paintings">FAMES</option> 
     <option value="works on paper">WORKS</option> 
     <option value="prints">LIFE</option> 
     <option value="sculptures">TIME</option> 
     <option value="design">DESIRE</option> 
     <option value="photography">FUTURE</option> 
    </optgroup> 
</select> 
<select id="mySelect2" multiple="multiple">   
    <optgroup label="TREND" value="TREND" stat="0"> 
     <option value="paintings">FAMES</option> 
     <option value="works on paper">WORKS</option> 
     <option value="prints">LIFE</option> 
     <option value="sculptures">TIME</option> 
     <option value="design">DESIRE</option> 
     <option value="photography">FUTURE</option> 
    </optgroup> 
</select> 

在您的JS

$(document).on('click','optgroup',function() 
{ 
    if($(this).attr('stat') == "0") 
    { 
     $(this).children().attr("selected", "selected"); 
     $(this).attr('stat', "1"); 
    } 
    else 
    { 
     $(this).children().attr("selected", false); 
     $(this).attr('stat', "0"); 
    } 
});