Edit page for bootstrap layout

This is a sample of what I’m currently using for simple edit forms. This is using bootstrap 3’s panels, and is a very simple and clean page.

 


@model ScheduleTemplateViewModel

@{

ViewBag.Title = “ScheduleTemplate”;

Layout = “~/Views/Shared/_Layout.cshtml”;

}

@using(Html.BeginForm(“Edit”, “ScheduleTemplate”, FormMethod.Post, new {@class = “form-horizontal”, @role = “form”}))

{

@Html.AntiForgeryToken()

@Html.ValidationSummary(true)

@Html.HiddenFor(model => model.Id)

@Html.HiddenFor(model => model.PropertyId)

@Html.HiddenFor(model=>model.HostedAccountId)

<div class=”row” >

<div class=”col-sm-8″><h3>@ViewBag.Task @ViewBag.Title</h3></div>

<div class=”col-sm-4″></div>

<!–  –>

</div>

<div class=”panel panel-primary”>

<div class=”panel-heading”><span class=”panel-title”>@ViewBag.Title Details</span><span class=”pull-right”>@Html.LabelFor(model => model.PropertyName):

@Html.DisplayFor(model => model.PropertyName)</span>

</div>

<div class=”panel-body”>

<div class=”row form-group”>

<div class=”col-sm-3″>@Html.LabelFor(model => model.Name,new {@class = “pull-right control-label”})</div>

<div class=”col-sm-5″>@Html.EditorFor(model => model.Name)

<div class=”help-inline”>@Html.ValidationMessageFor(model => model.Name)</div>

</div>

</div>

<div class=”row form-group”>

<div class=”col-sm-3″>@Html.LabelFor(model => model.Type,new {@class = “pull-right control-label”})</div>

<div class=”col-sm-5″> @Html.EditorFor(model => model.Type)

<div class=”help-inline”>@Html.ValidationMessageFor(model => model.Type)</div>

</div>

</div>

<div class=”row form-group”>

<div class=”col-sm-3″>@Html.LabelFor(model => model.FixedStartTime,new {@class = “pull-right control-label”})</div>

<div class=”col-sm-5″> @Html.EditorFor(model => model.FixedStartTime)

<div class=”help-inline”>@Html.ValidationMessageFor(model => model.FixedStartTime)</div>

</div>

</div>

<div class=”row form-group”>

<div class=”col-sm-3″>@Html.LabelFor(model => model.FixedEndTime,new {@class = “pull-right control-label”})</div>

<div class=”col-sm-5″> @Html.EditorFor(model => model.FixedEndTime)

<div class=”help-inline”>@Html.ValidationMessageFor(model => model.FixedEndTime)</div>

</div>

</div>

<div class=”row form-group”>

<div class=”col-sm-3″>@Html.LabelFor(model => model.FixedLength,new {@class = “pull-right control-label”})</div>

<div class=”col-sm-5″> @Html.EditorFor(model => model.FixedLength)

<div class=”help-inline”>@Html.ValidationMessageFor(model => model.FixedLength)</div>

</div>

</div>

<div class=”row form-group”>

<div class=”col-sm-3″>@Html.LabelFor(model => model.DefaultLength,new {@class = “pull-right control-label”})</div>

<div class=”col-sm-5″> @Html.EditorFor(model => model.DefaultLength)

<div class=”help-inline”>@Html.ValidationMessageFor(model => model.DefaultLength)</div>

</div>

</div>

<div class=”row form-group”>

<div class=”col-sm-3″>@Html.LabelFor(model => model.DefaultPreBufferTime,new {@class = “pull-right control-label”})</div>

<div class=”col-sm-5″> @Html.EditorFor(model => model.DefaultPreBufferTime)

<div class=”help-inline”>@Html.ValidationMessageFor(model => model.DefaultPreBufferTime)</div>

</div>

</div>

<div class=”row form-group”>

<div class=”col-sm-3″>@Html.LabelFor(model => model.DefaultPostBufferTime,new {@class = “pull-right control-label”})</div>

<div class=”col-sm-5″> @Html.EditorFor(model => model.DefaultPostBufferTime)

<div class=”help-inline”>@Html.ValidationMessageFor(model => model.DefaultPostBufferTime)</div>

</div>

</div>

<div class=”row form-group”>

<div class=”col-sm-3″>@Html.LabelFor(model => model.EnforcePreBufferTime,new {@class = “pull-right control-label”})</div>

<div class=”col-sm-5″> @Html.EditorFor(model => model.EnforcePreBufferTime)

<div class=”help-inline”>@Html.ValidationMessageFor(model => model.EnforcePreBufferTime)</div>

</div>

</div>

<div class=”row form-group”>

<div class=”col-sm-3″>@Html.LabelFor(model => model.EnforcePostBufferTime,new {@class = “pull-right control-label”})</div>

<div class=”col-sm-5″> @Html.EditorFor(model => model.EnforcePostBufferTime)

<div class=”help-inline”>@Html.ValidationMessageFor(model => model.EnforcePostBufferTime)</div>

</div>

</div>

</div>

</div>

<div>

<input class=”btn btn-primary” type=”submit” value=”Save” /> @Html.ActionLink(“Back to list”, “Index”)

</div>

}

<div>

@Html.ActionLink(“Back to list”, “Index”)

</div>

 

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

w

Connecting to %s