显示在多选择下拉jquery的所有类别

Question

这是我多选择下拉代码

<select class="form-control" id="lstFruits" required multiple="multiple" name="catId[]"> 
    @foreach($catlists as $category) 
    <option value="{!! $category->id !!}" >{!! $category->name !!}</option> 
    @endforeach 
</select> 
<script type="text/javascript"> 
    $(function() { 
     $('#lstFruits').multiselect({ 
      includeSelectAllOption: true 
     }); 
     $('#btnSelected').click(function() { 
      var selected = $("#lstFruits option:selected"); 
      var message = ""; 
      selected.each(function() { 
       message += $(this).text() + " " + $(this).val() + "\n"; 
      }); 
      alert(message); 
     }); 
    }); 
</script> 

问：

当我选择超过4个类别将显示4选择，但我想在下拉菜单中显示这4个类别。

它显示此：

我想是这样的，应显示所有类别。

Answer 1

基础上documentation，你必须覆盖buttonText属性：

$('#lstFruits').multiselect({ 
    ... 
    buttonText: function(options, select) { 
     var labels = []; 
     options.each(function() { 
      if ($(this).attr('label') !== undefined) { 
       labels.push($(this).attr('label')); 
      }else { 
       labels.push($(this).html()); 
      } 
     }); 
     return labels.join(', ') + ''; 
    } 
});