Description: In this article I will describe how to generate or create
automatic razor view (Cshtml) page from the controller Class Action Result
Method.
Content: Now Suppose you have the controller class and you have all the
necessary action event (Index,Edit,Create,Delete,Details) definition in your
controller class.
Now what you need you have to create the razor view (Cshtml) page under the
"Views" folder. After that you have to type lots of coding stuff into your view
page.
But in asp.net mvc 3 you have the facility to create the view page direct form
your Controller class.
For that you have to use the "scaffold template" .
Here I am giving a small example by how you will generate the automatic view
page from your controller action event.
Now suppose I have an Action Result Method "create" in my controller class name
"Homecontroller". This method actually does the Insert operation when you want
to insert some data through your related View Page.
Now here the sample code of my create method in to my controller class
#region
Registrationformevent
public
ActionResult Create()
{
ViewBag.Message = "Welcome to Login
Page";
var v = ViewData.Model = _db.Employee.ToList();
var Employee =
new Employee();
return View(Employee);
}
//
// POST:
/Home/Create
[HttpPost]
public
ActionResult Create(Employee Employee)
{
try
{
// TODO: Add insert logic here
if (ModelState.IsValid)
{
//Save Registration
_db.Employee.Add(Employee);
_db.SaveChanges();
return RedirectToAction("Index");
}
//return RedirectToAction("Index");
//ViewBag.Route = _db.Cab.OrderBy(g =>
g.JourneyTime).ToList();
// ViewBag.DropPoint = _db.Employee.OrderBy(a
=> a.EmployeeName).ToList();
return View(Employee);
}
catch
{
return View();
}
}
#endregion
public ActionResult
LogIn()
{
return View();
}
Here I am describing how to generate the razor view automatically from this
method.
Step 1:
Right click the "public ActionResult Create()" method and click "add view" just
like
![Razor1.gif]()
Figure 1.
Step 2:
After clicking the "add view "button you will see a window form name "add view".
See in that form the "create" name is displaying under the View name segment
just like Figure2 (marked as red).
So the razor view name takes automatically from your controller method name
means the name "create"
![Razor2.gif]()
Figure 2:
Step 3:
After that first check the "Create- a strongly typed view". Then Choose the Your
Model Class form the Drop down List. For me it is showing the Employee class.
After that in the "Scaffold template" drop down list you will see there are lot
of option like "create",delete","index",Details","Edit".Actually this all option
comes according to your controller class event.
Here we want to create the razor view of "create" action result method from the
controller class so we will select the "create" from the dropdown list.
In the Figure 3 You will see the step marked as red
![Razor3.gif]()
Figure 3:
Now when you click the add button it will automatically create the view page
name "create" with all the necessary code which will map from your model class
for insert operation under the "Home" folder under the main "Views" folder.
![Razor4.gif]()
Just like Figure 4:
The "create.cshtml" code will look like
@model
CabAutomationSystem.Models.Employee
@{
ViewBag.Title = "Create";
}
<h2>Create</h2>
<script
src="@Url.Content("~/Scripts/jquery.validate.min.js")"
type="text/javascript"></script>
<script
src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")"
type="text/javascript"></script>
@using
(Html.BeginForm()) {
@Html.ValidationSummary(true)
<fieldset>
<legend>
Fill Employee Details</legend>
<div
class="editor-label">
@Html.LabelFor(model
=> model.EmployeeName)
</div>
<div
class="editor-field">
@Html.EditorFor(model
=> model.EmployeeName)
@Html.ValidationMessageFor(model
=> model.EmployeeName)
</div>
<div
class="editor-label">
@Html.LabelFor(model
=> model.EmployeeNo )
</div>
<div
class="editor-field">
@Html.EditorFor(model
=> model.EmployeeNo)
@Html.ValidationMessageFor(model
=> model.EmployeeNo)
</div>
<div
class="editor-label">
@Html.LabelFor(model
=> model.Email) as UserName
</div>
<div
class="editor-field">
@Html.EditorFor(model
=> model.Email)
@Html.ValidationMessageFor(model
=> model.Email)
</div>
<div
class="editor-label">
@Html.LabelFor(model
=> model.Password)
</div>
<div
class="editor-field">
@Html.EditorFor(model
=> model.Password)
@Html.ValidationMessageFor(model
=> model.Password)
</div>
@* <div class="editor-label">
@Html.LabelFor(model => model.ConfirmPassword)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.ConfirmPassword)
@Html.ValidationMessageFor(model => model.ConfirmPassword)
</div>*@
<div
class="editor-label">
@Html.LabelFor(model
=> model.ProjectName)
</div>
<div
class="editor-field">
@Html.EditorFor(model
=> model.ProjectName)
@Html.ValidationMessageFor(model
=> model.ProjectName)
</div>
<div
class="editor-label">
@Html.LabelFor(model
=> model.Cab.JourneyPlace)
</div>
<div
class="editor-field">
@Html.EditorFor(model
=> model.Cab.JourneyPlace)
@Html.ValidationMessageFor(model
=> model.Cab.JourneyPlace)
</div>
<div
class="editor-label">
@Html.LabelFor(model
=> model.Gender)
</div>
<div
class="editor-field">
@* @Html.EditorFor(model => model.Gender)*@
@Html.RadioButtonFor(model
=> model.Gender,"Male",true)
Male @Html.RadioButtonFor(model =>
model.Gender,"Female",false)
Female
@Html.ValidationMessageFor(model
=> model.Gender)<br
/>
</div>
@* <div class="editor-label">
@Html.LabelFor(model => model.Cab.JourneyTime )
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Cab.JourneyTime)
@Html.ValidationMessageFor(model => model.Cab.JourneyTime)
</div>*@
<p>
<input
type="submit"
value="Create"
/>
</p>
</fieldset>
}
<div>
@Html.ActionLink("Back
to List", "Index")
</div>
Conclusion:
So in this Article We have learned how to generate the automatic Razor view code
from controller class.