我正在使用bootstrap创建一个多选下拉列表,这是html:
<form id="multiselectForm" method="post" class="form-horizontal">
<div class="form-group">
<label class="col-xs-3 control-label">Browser</label>
<div class="col-xs-5">
<select class="form-control" name="browsers" multiple="multiple">
<option value="chrome">Google Chrome</option>
<option value="firefox">Firefox</option>
<option value="ie">IE</option>
<option value="safari">Safari</option>
<option value="opera">Opera</option>
<option value="other">Other</option>
</select>
</div>
</div>
</form>
这是JS:
$('#multiselectForm').find('[name="browsers"]')
.multiselect({
enableFiltering: true,
includeSelectAllOption: true,
// Re-validate the multiselect field when it is changed
onChange: function(element, checked) {
$('#multiselectForm').formValidation('revalidateField', 'browsers');
adjustByScrollHeight();
},
onDropdownShown: function(e) {
adjustByScrollHeight();
},
onDropdownHidden: function(e) {
adjustByHeight();
}
})
.end();
但所需的内容如下:
我不知道为什么会出现底部带有蓝色组合框的框,我想删除它。
我在项目中包含的这些文件需要确定哪一个文件干扰了多选下拉列表:
bundles.Add(new StyleBundle("~/Bundles/css")
.Include("~/Content/css/bootstrap.css")
.Include("~/Content/css/select2.css")
.Include("~/Content/css/datepicker3.css")
.Include("~/Content/css/AdminLTE.css")
.Include("~/Content/css/skins/_all-skins.css")
.Include("~/Content/css/Afiniti.css")
.Include("~/Content/css/configtree.css")
.Include("~/Content/css/animate.css")
.Include("~/Content/css/d3-context-menu.css")
.Include("~/Content/Gridmvc.css")
.Include("~/Content/css/font-awesome-anim.css")
.Include("~/Content/css/bootstrap-multiselect.css")
.Include("~/Content/css/Less/bootstrap-multiselect.css")
.Include("~/Content/css/d3-context-menu.css"));
//.Include("~/Content/css/dataTables.bootstrap.css"));
bundles.Add(new ScriptBundle("~/Bundles/js")
.Include("~/Content/js/plugins/jquery/jquery-2.2.4.js")
.Include("~/Content/js/plugins/jquery/jquery.tmpl.js")
// .Include("~/Content/js/plugins/date/date.js")
.Include("~/Content/js/plugins/bootstrap/bootstrap.js")
.Include("~/Content/js/plugins/fastclick/fastclick.js")
.Include("~/Content/js/plugins/slimscroll/jquery.slimscroll.js")
.Include("~/Content/js/plugins/select2/select2.full.js")
.Include("~/Content/js/plugins/moment/moment.js")
.Include("~/Content/js/plugins/datepicker/bootstrap-datepicker.js")
.Include("~/Content/js/plugins/icheck/icheck.js")
.Include("~/Content/js/app.js")
.Include("~/Content/js/d3/d3.js")
.Include("~/Content/js/d3-context-menu.js")
.Include("~/Content/js/init.js")
.Include("~/Content/js/plugins/noty/jquery.noty.packaged.min.js")
.Include("~/Content/js/plugins/noty/themes/default.js")
.Include("~/Content/js/plugins/noty/layout/center.js")
.Include("~/Content/js/plugins/noty/layout/topCenter.js")
// FIXME: Adding this so the widgets may be initialized
.Include("~/Scripts/Chart.js")
.Include("~/Scripts/jquery.sparkline.js")
.Include("~/Scripts/morris/morris.js")
.Include("~/Scripts/morris/raphael.js")
.Include("~/Scripts/gridmvc.js")
.Include("~/Content/js/d3.tip.v0.6.3.js")
.Include("~/Content/js/bootstrap-multiselect.js")
.Include("~/Content/js/bootstrap-multiselect-collapsible-groups.js")
);
bundles.Add(new ScriptBundle("~/Bundles/jquery")
.Include("~/Content/js/plugins/jquery/jquery-2.2.4.js")
.Include("~/Scripts/Chart.js")
);
bundles.Add(new StyleBundle("~/Bundles/logincss")
.Include("~/Content/css/AdminLTE.css")
.Include("~/Content/css/Afiniti.css")
);
bundles.Add(new ScriptBundle("~/Bundles/loginjs")
.Include("~/Content/js/plugins/jquery/jquery-2.2.4.js")
.Include("~/Content/js/plugins/bootstrap/bootstrap.js")
.Include("~/Content/js/plugins/icheck/icheck.js")
.Include("~/Scripts/jquery.validate.js")
.Include("~/Scripts/jquery.validate.js")
.Include("~/Scripts/jquery.validate.unobtrusive.js"));