css - 表单的 Bootstrap 显示

Question

这对我来说没有意义。我正在尝试在我的 MVC5 元素中显示一个带有 4 个输入字段的表单。当我不使用 @using (HTML.BeginForm(...){..}

@using (Html.BeginForm("Create", "HR", FormMethod.Post)) {

我的显示器看起来很完美

但是一旦我输入 @using (HTML.BeginForm(..) 语句，显示如下:

我的 html 助手哪里出错了？

这是我正在使用的一些示例 html 辅助方法..

<div class="panel-group">
<div class="panel panel-primary">
    <div class="panel-heading"><h4>Create New Employee</h4></div>
    <div class="panel-body"> 
        <form class="form-horizontal">
     <div class="form-group">
                    <label class="control-label col-sm-2">First Name</label>
                    <div class="col-sm-10"> 
                        @Html.TextBoxFor(m => m.FirstName, new { @class = "form-control", placeholder = "Enter First Name" })
                    </div>
             </div>
     <div class="form-group">
                    <label class="control-label col-sm-2" for="pwd">Middle Name</label>
                    <div class="col-sm-10"> 
                        @Html.TextBoxFor(m => m.MiddleName, new { @class = "form-control", placeholder = "Enter Middle Name" })
                    </div>
             </div>
     </form> 
  </div>
   </div> 

Answer 1

看起来您在使用 @Html.BeginForm 时丢失了类属性。像这样添加回去:

<div class="panel-group">
<div class="panel panel-primary">
    <div class="panel-heading"><h4>Create New Employee</h4></div>
    <div class="panel-body"> 
    @using (Html.BeginForm("ActionName", "ControllerName", FormMethod.Post, new { @class="form-horizontal" }))
    {
     <div class="form-group">
                    <label class="control-label col-sm-2">First Name</label>
                    <div class="col-sm-10"> 
                        @Html.TextBoxFor(m => m.FirstName, new { @class = "form-control", placeholder = "Enter First Name" })
                    </div>
             </div>
     <div class="form-group">
                    <label class="control-label col-sm-2" for="pwd">Middle Name</label>
                    <div class="col-sm-10"> 
                        @Html.TextBoxFor(m => m.MiddleName, new { @class = "form-control", placeholder = "Enter Middle Name" })
                    </div>
             </div>
     }
  </div>
</div>