Bootstrap multiselect在Instanciation中選擇所有選項

我使用bootstrap multiselect插件將動態代碼添加到select中。這裏是我的代碼：Bootstrap multiselect在Instanciation中選擇所有選項

HTML：

<label> 
    <span>Underlyings</span> 
    <select class="multiselect" multiple></select> 
</label>

的Javascript

var name = ['joe', 'mary', 'rose']; 

R.map(function (x) { 
    return $('.multiselect', d.el).append("<option>" + x + "</option>"); 
}, name); 

$('.multiselect', d.el).multiselect({ 
    allSelectedText: 'All', 
    maxHeight: 200, 
    includeSelectAllOption: true 
});

當多個選擇的instancied，它顯示爲這樣的瀏覽器（有一些CSS格式解釋其方面）：

而我想它顯示爲（與instanciation選擇了所有複選框，沒有對「全選」點擊）：

我看着文檔，但沒有找到它...

Bootstrap multiple select documentation

來源

2016-10-10 Colonel Beauvel

您需要同時運行selectAll（與false作爲第二個參數 - 這表明，所有值將被選中，甚至是不可見的值）和updateButtonText（更改顯示在下拉菜單中的文本）。

檢查這個例子：

$(function() { 
 
    var name = ['joe', 'mary', 'rose']; 
 
    $.map(name, function (x) { 
 
    return $('.multiselect').append("<option>" + x + "</option>"); 
 
    }); 
 
    
 
    $('.multiselect') 
 
    .multiselect({ 
 
     allSelectedText: 'All', 
 
     maxHeight: 200, 
 
     includeSelectAllOption: true 
 
    }) 
 
    .multiselect('selectAll', false) 
 
    .multiselect('updateButtonText'); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.2/css/bootstrap.min.css" /> 
 
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script> 
 

 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-multiselect/0.9.13/css/bootstrap-multiselect.css" /> 
 
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-multiselect/0.9.13/js/bootstrap-multiselect.min.js"></script> 
 

 
<label> 
 
    <span>Underlyings</span> 
 
    <select class="multiselect" multiple="multiple"></select> 
 
</label>

來源

2016-10-10 16:51:30 Dekel

在以前的嘗試我設置'selectAll'爲false和'updateButtonText'...已接近但感謝您的努力和工作示例！ –

allSelectedText已過時，請使用selectAllText代替，證明：http://davidstutz.github.io/bootstrap-multiselect/#configuration-options-selectAllName – VoVaVc

，如果你想刷新引導多選擇則是三線的代碼，你可以嘗試： $("#YourButtonId").click(function() { $("#YourMultiSelectId").multiselect("deselectAll", false); $("#YourMultiSelectId").multiselect('updateButtonText'); });

來源

2017-12-20 06:30:38

如果您喜歡，請發表評論 –

Bootstrap multiselect在Instanciation中選擇所有選項

回答

相關問題