已选择的jQuery插件 - 限制Multiselect中的选定选项

Question

我正在使用选择jquery插件，我想限制多选中的选定选项。有一个建议的解决方案$(".chosen-select").chosen({max_selected_options: 5});，但它不适用于我！

这是我的js文件：

$(document).ready(function(){ 
// ..... 
$(".chosen-select").chosen({max_selected_options: 5}); 
//..... 
}); 

这是php文件：

<em>Country</em> 
<select data-placeholder="Choose your country..." id="mycountry" class="chosen-select" multiple style="width:400px;" tabindex="4"> 
       <option value=""></option> 
       <?php 
// Data from dataabse 
?> 
</select> 

Answer 1

安装时选的，你必须在你添加这些行网页：

<script type="text/javascript"> 
      var config = { 
       '.chosen-select'   : {}, 
       '.chosen-select-deselect' : {allow_single_deselect:true}, 
       '.chosen-select-no-single' : {disable_search_threshold:10}, 
       '.chosen-select-no-results': {no_results_text:'Oops, nothing found!'}, 
       '.chosen-select-width'  : {width:"95%"} 
      } 
      for (var selector in config) { 
       $(selector).chosen(config[selector]); 
      } 

而且你必须使用这些行配置你选择的插件。例如，如果您想限制多选中五个项目的选定选项。随时用这个新来更新该行'.chosen-select' : {},：'.chosen-select' : {max_selected_options: 5},

这是所有

Answer 2

此代码对我的作品 -

$(".demo-chosen-select").chosen({ 
max_selected_options:3, //Max select limit 
display_selected_options:true, 
placeholder_text_multiple:"Select some options", 
no_results_text:"Results not found", 
enable_split_word_search:true, 
search_contains:false, 
display_disabled_options:true, 
single_backstroke_delete:false, 
width:"200px", 
inherit_select_classes:true 
}); 

完蛋了..

Answer 3

上述解决方案需要传递一个选项初始化。因此，您需要设置全局限制，或分别在页面上初始化每个不同的限制选择。

我添加以下如果块中chosen.jquery.min.js组分（对于所选择V1.3.0）

Chosen.prototype.on_ready = function() { 
 
if(this.form_field.getAttribute('data-limit')){ 
 
    this.max_selected_options = this.form_field.getAttribute('data-limit'); 
 
} 
 
return this.form_field_jq.trigger("chosen:ready", {chosen: this})

这将从选择读出的数据限制属性和在初始化时替换或创建max_selected_option。