Asp.Net MVC Razor BootStrap Eingabeformular

Question

Zur Zeit habe ich eine Eingabemaske wie folgt aus:

<div class="editor-label"> 
      @Html.LabelFor(model => model.VenueID) 
     </div> 
     <div class="editor-field"> 
      @Html.EditorFor(model => model.VenueID) 
      @Html.ValidationMessageFor(model => model.VenueID) 
     </div> 

ich möchte es konvertieren, um die folgende Bootstrap-Code verwendet:

<div class="form-group"> 
     <label for="inputVenueID" class="col-lg-2 control-label">Venue ID</label> 
     <div class="col-lg-10"> 
     <input type="text" class="form-control" id="inputVenueID" placeholder="VenueID"> 
     </div> 
    </div> 

Wie mache ich das, damit ich immer noch die gleiche Razor Syntax von HTML.LabelFor/EditorFor/ValidationMessage etc verwenden kann?

Answer 1

Sie können CSS-Klassen mit Razor-Syntax hinzufügen, wie unten gezeigt. Alles, was Sie tun müssen, ist die Bootstrap-Klasse (n) anzugeben, die Sie verwenden möchten.

<div class="editor-field"> 
    @Html.TextBoxFor(model => model.VenueID, new { @class = "form-control" }) 
    @Html.ValidationMessageFor(model => model.VenueID) 
</div> 

Answer 2

<div class="form-group"> 
    @Html.LabelFor(model => model.VenueID, new { @class = "sr-only", @for = "txtVenueID" }) 
    @Html.TextBoxFor(model => model.VenueID, new { @class = "form-control", @placeholder = "ID:" , @id="txtVenueID" }) 
    @Html.ValidationMessageFor(model => model.VenueID) 
</div>