In an ASP. NET MVC view, the default form is a vertical form, and the T4 template created with VS automatically is a horizontal form, compared to the <div class= "Form-horizontal" > and Class=control-label, There are no column layout items such as col-md-2 <div class= "col-md-10" >. But <class= "Form-control" > still remains.
The following view code represents a vertical form.
@using (Html.BeginForm ())
{
@Html. AntiForgeryToken ()
@Html. ValidationSummary (True, "", new {@class = "Text-danger"})
<div class= "Form-group" >
@Html. labelfor (model = model. CategoryID)
@Html. DropDownList ("CategoryID", NULL, htmlattributes:new {@class = "Form-control"})
@Html. validationmessagefor (model = model. CategoryID, "", new {@class = "Text-danger"})
</div>
<div class= "Form-group" >
@Html. labelfor (model = model. Title)
@Html. editorfor (model = model. Title, new {htmlattributes = new {@class = "Form-control"}})
@Html. validationmessagefor (model = model. Title, "", new {@class = "Text-danger"})
</div>
<div class= "Form-group" >
@Html. labelfor (model = model. Content)
@Html. editorfor (model = model. Content)
</div>
<div class= "Form-group" >
@Html. labelfor (model = model. AuthorName)
@Html. editorfor (model = model. AuthorName, new {htmlattributes = new {@class = "Form-control"}})
@Html. validationmessagefor (model = model. AuthorName, "", new {@class = "Text-danger"})
</div>
<div class= "Form-group" >
@Html. labelfor (model = model. Posttime)
@Html. editorfor (model = model. Posttime, new {htmlattributes = new {@class = "Form-control"}})
@Html. validationmessagefor (model = model. Posttime, "", new {@class = "Text-danger"})
</div>
<input type= "Submit" value= "new" class= "btn Btn-default"/>
}
The more general original HTML tags are:
<form Class="Form-horizontal" Role="Form"> <div Class="Form-group"> <label For="FirstName" Class="Col-sm-2 Control-label">Name</label> <div Class="Col-sm-10"> <input Type="Text" Class="Form-control" Id="FirstName" Placeholder="Please enter a name"> </div> </div> <div Class="Form-group"> <label For="LastName" Class="Col-sm-2 Control-label">Name</label> <div Class="Col-sm-10"> <input Type="Text" Class="Form-control" Id="LastName" Placeholder="Please enter last name"> </div> </div> <div Class="Form-group"> <div Class="Col-sm-offset-2 col-sm-10"> <div Class="checkbox"> <label> <input Type="checkbox">Please remember me</label> </div> </div> </div> <div Class= "Form-group" > <div class= "col-sm-offset-2 col-sm-10" > <button type= "submit" class= "btn Btn-default" > login </button>< Span class= "PLN" > </div> </div> </form></body> </HTML>
Bootstrap Vertical (default) Form