在引导程序多选下拉列表中显示选定的NUMBERS而不是复选框值

时间:2013-10-22 07:28:57

标签: css3 twitter-bootstrap

我有Bootstrap Multi-select下拉列表,代码为:

<select class="multiselect" multiple="multiple">
    <option value="one">test value for one</option>
    <option value="two">test value for two</option>
    <option value="three">test value for three</option>
    <option value="four">test value for four</option>
</select>

每当我从1到3中选择它时,它会显示所选的值。在下拉列表中选择第四个复选框后,它将开始显示“4 Selected”。问题是我需要修复下拉列表的宽度,这样如果我选择一个,我需要显示1选择而不是第一个复选框值。我怎样才能做到这一点。

也试过这个,但我没找到我到底需要什么。 http://davidstutz.github.io/bootstrap-multiselect/

提前致谢。

1 个答案:

答案 0 :(得分:0)

如果您使用http://davidstutz.github.io/bootstrap-multiselect/,请尝试按照代码...

DEMO LINK

<强> JS:

$('#example').multiselect({
     buttonWidth: '500px',
     buttonText: function (options) {
         if (options.length == 0) {
             return 'None selected <b class="caret"></b>';
         } else {
             var selected = 0;
             options.each(function () {
                 selected += 1;
             });
             return selected +  ' Selected  <b class="caret"></b>';
         }
     }
 });

<强> HTML:

<select id="example" multiple="multiple">
    <option value="cheese">Cheese</option>
    <option value="tomatoes">Tomatoes</option>
    <option value="mozarella">Mozzarella</option>
    <option value="mushrooms">Mushrooms</option>
    <option value="pepperoni">Pepperoni</option>
    <option value="onions">Onions</option>
</select>