Bootstrap 3多选插件作为表单元素

Question

我正在尝试将multiselect plugin添加到我的表单中。 我已经设法使一切工作正常（http://jsfiddle.net/Misiu/t2qaP/），但我希望选择100％宽度。
我可以手工添加css：

 .btn-group, .btn-group .multiselect {
    width: 100% !important;
}

但是也许有更好的方法可以使用bootstrap来做到这一点吗？

这是我的演示：http://jsfiddle.net/Misiu/t2qaP/

Answer 1

再次问好;） 参见

<强>已更新

http://jsfiddle.net/t2qaP/13/

select.multiselect,
select.multiselect + div.btn-group,
select.multiselect + div.btn-group button.multiselect,
select.multiselect + div.btn-group.open .multiselect-container{
    width:100% !important;
}

更新2 您需要将buttonClass添加到多选选项中。但为什么呢？看起来很棒。 http://jsfiddle.net/t2qaP/14/

$('.multiselect').multiselect({
    includeSelectAllOption: true,
    buttonClass: 'form-control'
});

Answer 2

如果您不想修改css，可能需要使用buttonWidth选项。见下面的例子。

$('.multiselect').multiselect({
    includeSelectAllOption: true,
    buttonWidth: '411px'// here you need to specify width value
});

Demo Fiddle

Answer 3

http://jsfiddle.net/t2qaP/12/

$('.input-daterange').datepicker();
$('.multiselect').multiselect({
    includeSelectAllOption: true,
    buttonClass : "col-sm-12"
});

multiselect插件允许管理它。