Bootstrap：将复选框与下拉菜单匹配

Question

我想在我的 ASP.Net MVC 应用程序中将复选框与下拉菜单匹配（该复选框将启用/禁用下拉菜单）。我试图更改code on the official bootstrap site，它显示了如何将复选框与输入框匹配以适合我自己的需要。但这并没有真正奏效。

我的 html 看起来像这样：

<div class="row">
                    <div class="col-md-3">
                        @Html.LabelForConfig(model => model.CompanyPkid)
                    </div>
                    <div class="col-lg-9">
                        <div class="input-group">
                            <span class="input-group-addon">
                                @Html.CheckBoxFor(model => model.IsSCompanyForPush)
                            </span>
                            @Html.DropDownListFor(model => model.CompanyPkid, Model.SelectOptions.CompanyPkidList)
                        </div><!-- /input-group -->
                    </div><!-- /.col-lg-6 -->
                </div>

这给出以下结果：

如何解决这个问题，让它看起来更干净？

Answer 1

要应用引导输入样式，您需要为下拉列表提供 form-control 类：

@Html.DropDownListFor(model => model.CompanyPkid, Model.SelectOptions.CompanyPkidList, new { @class = "form-control" })