用于DropDownListFor的CSS类

-1

在MVC5应用程序中使用脚手架项目时，我看到类似于CSS类“form-control”的文本字段。这些字段都具有一致的圆角，相同的字体颜色/大小等。用于DropDownListFor的CSS类

现在我添加了一个使用“@ Html.DropdownListFor”的下拉列表，它是正方形的，具有不同的字体颜色。

我知道我可以指定在Razor中使用哪个CSS类，例如

@Html.DropDownListFor(model => model.OrderItemTypeId, (SelectList)ViewBag.OrderItemTypes, new { htmlAttributes = new { @class = "###########" } })

但是我不知道用什么来代替###########。如果我指定“形式控制”只是给了我上面描述的方框。 “形式控制选择”似乎也没有做太多。

这里展示其直接

 <div class="form-group"> 
      @Html.LabelFor(model => model.Title, htmlAttributes: new { @class = "control-label col-md-2" }) 
      <div class="col-md-10"> 
       @Html.EditorFor(model => model.Title, new { htmlAttributes = new { @class = "form-control" } }) 
       @Html.ValidationMessageFor(model => model.Title, "", new { @class = "text-danger" }) 
      </div> 
     </div> 

     <div class="form-group"> 
      @Html.LabelFor(model => model.OrderItemTypeId, htmlAttributes: new { @class = "control-label col-md-2" }) 
      <div class="col-md-10"> 
       @Html.DropDownListFor(model => model.OrderItemTypeId, (SelectList)ViewBag.OrderItemTypes, new { htmlAttributes = new { @class = "form-control" } }) 
       @Html.ValidationMessageFor(model => model.OrderItemType, "", new { @class = "text-danger" }) 
      </div> 
     </div>

上面一个好风格的文本字段一个更大的片断是我可以使用，这将使我的下拉外观与所有其他的文本字段我已经有相同的值？

谢谢

来源

2016-09-27 Richard

第三个参数已经是的htmlAttributes领域，使你的语法是错误的。这是你之后：

@Html.DropDownListFor(model => model.OrderItemTypeId 
    (SelectList)ViewBag.OrderItemTypes, 
    new { @class = "form-control etc" })

请参阅MSDN。

来源

2016-09-29 19:49:11

不能相信我做到了。谢谢：） – Richard

您需要确保它位于正确的外层标签层次结构和相应的类中。

请参见下面的代码，我从这篇文章了 - How to use Bootstrap 3 validation states with ASP.NET MVC Forms

<div class="row"> 
    <div class="col-sm-4 col-sm-offset-4"> 
     <div class="panel panel-default"> 
      <div class="panel-body"> 
       @using (Html.BeginForm("UserProfile", "Profile", FormMethod.Post, new { role = "form", id="userForm" })) { 

        @* State selection dropdown *@ 
        <div class="form-group"> 
         @Html.LabelFor(m => m.State) 
         @Html.DropDownListFor(m => m.State, // Store selected value in Model.State 

               // This argument needs some explanation - here we take a Distionary<string, string> 
               // and turn it into an instance of SelectList, see blog post for more details 
               new SelectList(Model.States, "Key", "Value"), 

               // Text for the first 'default' option 
               "- Please select your state -", 

               // A class name to put on the "<select>" 
               new { @class = "form-control" } 
              ) 
         @Html.ValidationMessageFor(m => m.State) 
        </div> 

        <button type="submit" class="btn btn-primary">Update</button> 
       } 
      </div> 
     </div> 
    </div> 
</div>

来源

2016-09-29 06:30:43 Art

谢谢艺术，我复制了另一行有一个（一致格式）的文本字段，并把我的下拉列表中，所以据我可以告诉它在正确的层次结构，它有形式控制类，但它仍然看起来不同。我已将我的代码添加到我的问题中以使其更清晰。任何想法我做错了什么？ – Richard

用于DropDownListFor的CSS类

回答

相关问题