Search code examples
c#asp.net-mvctwitter-bootstraprazorbootswatch

Asp.Net MVC Razor BootStrap Input Form


Currently I have an Input form like this:

<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>

I want to convert it to using the following bootstrap code:

<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>

How do I do this, so that I can still use the same Razor syntax of HTML.LabelFor / EditorFor / ValidationMessage etc?


Solution

  • <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>