在Multi select dropdown 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(', ') + '';
    }
});