Create automatic Razor view code from Controller Class using scaffold template in asp.net mvc3

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



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"



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



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.



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.