Understand Controller Scaffolding Templates in Asp.Net MVC 4 Example

  Total Views : 1751
  Comments : 0
 
  Keywords : What is scaffolding in asp.net mvc?, Asp.net mvc controller scaffolding templates example, Perform curd operations using controller scaffolding template in asp.net mvc,

Here we will learn what is scaffolding in asp.net mvc and types of controller scaffoldings in asp.net Scaffolding is technique used in asp.net mvc to generate basic CRUD operation (Create, Delete, Details, Edit and List) from Model but it is basic code from that we need to edit and customize code according to our requirement.

 

We mostly use scaffolding when we need code quickly and if we use scaffolding it also reduce application development time. Now let’s create a basic asp.net mvc 4 application to under stand Controller scaffolding Template in asp.net mvc

Create Application in Asp.Net MVC

Now let’s create a basic ASP.NET MVC 4 application to under stand View scaffolding Template for that Open visual studio studio à Go to File à Select New à Select Project

 

create new asp.net mvc project from visual studio 2012

 

After that you will see new dialog will pop up for selecting your Template and Project type. From Templates select Visual C# à inside that select Web and then project type select ASP.NET MVC 4 Web Application and here we are giving name as “MVCDemo1” then finally click on OK button.

 

Now new dialog will pop up for selecting template in that Select Basic Template and click ok it will create our MVCDemo1 project that will be like as shown below

 

Controller Scaffolding template asp.net mvc application

 

After completion of creating application now it’s time to create database. For showing demo we already created a Database with name EmployeeDB and table with name EmployeeDetails like as shown below 

EmployeeDB Database

EmployeeDB Database in asp.net mvc application for database approach in entity framework

EmployeeDetails Table

Employee Details Table in Database First Approach in EF

Installing Entity framework in Application

For adding Entity framework just right click on your application and from above list select “Manage NuGet Packages” like as shown below 

 

Add nuget package in asp.net mvc application

 

After select a new dialog will popup of “Manage NuGet Packages” inside search box enter “Entityframework”. After getting search value select Entityframework click on install button.

 

Installing Entity Framework in Asp.net mvc application

 

After adding it will show an ok sign in green color like as shown below

 

Installed Entity Framework in asp.net mvc web application

 

After adding Entity framework now we are going to add ADO.NET Entity Data Model

Adding ADO.NET Entity Data Model

For adding ADO.NET Entity Data Model just right click on Model folder and select Add inside that Select ADO.NET Entity Data Model

 

Add ado.net entity data model in asp.net mvc application

 

 After clicking on ADO.NET Entity Data Model a New Dialog will pop up for entering Item name inside that you can enter any name but it must be unique and click on OK button like as shown below

 

Giving Name to Ado.net model in mvc application

 

 After that a new Wizard will popup like as shown below

 

Choose Model Content for Ado.net model in database first approach

 

From that select Generate from database and click on Next button. After clicking on Next button a New Wizard will pop up for Choosing Data Connection.

Choosing Data Connection

Choosing New Database Connection in Database First Approach in Asp.net mvc

 

Now click on New Connection a new Dialog will popup. Here we need to configure it. In Server name you need to add your Sql Server Name and select either Using Windows Authentication or Using Sql Server Authentication to connect SQL Server. Here we selected Using Sql Server Authentication and entered User name and Password of Sql server. Last we are going to select Database Name EmployeeDB once we done click on OK button as shown below

 

Configure Database Connection in Database First Approach in Asp.Net MVC Applicaiton

 

After adding database connection our Entity Data Model Wizard will look like below snapshot

 

Entity Data Model Wizard with Database conneciton in asp.net mvc application

 

Now click on Next button. A new wizard will pop up for selecting database object and in this you will see all the table which we have created in database

 

Choose Table Database in Database first approach in asp.net mvc application

 

And last click on Finish button. Here is snapshot after adding ADO.NET Entity Data Model

 

After adding ado.net connection in asp.net mvc application

Adding Controller in Application

Now we will add controller in our application for that Just Right click on Controller Folder inside that select Add and then select Controller. After clicking on Controller new dialog will pop up with name Add Controller like as shown below 

 

Adding New Controller in Scaffolding template asp.net mvc application

 

Now first option is to provide name to Controller. The name of controller must be unique and it should contain Controller in prefix for E.g. AboutController  (It has Name About and Controller in prefix to it).

Scaffolding Options

After name we have next option as Templates before starting that let’s understand each template first

 

  1. Empty MVC controller
  2. MVC controller with read/write action and views, using Entity framework.
  3. MVC controller with empty read/write actions.
  4. Empty API controller
  5. API controller with read/write action and views, using Entity framework.
  6. API controller with empty read/write actions

Empty MVC controller

In case if we select template as Empty MVC Controller It will generate a new controller with given name and it also has an action method with name index in it.

 

Adding New Controller in Scaffolding template asp.net mvc application

 

 Our controller will contain code like as shown below 

 

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.Mvc;

 

namespace MVCDemo1.Controllers

{

public class HomeController : Controller

{

//

// GET: /Home/

public ActionResult Index()

{

return View();

}

}

}

MVC controller with read/write action and views, using Entity framework

In case if we select “MVC controller with read/write action and views, using Entity framework“ template it will generate all CRUD operations (Create ,Edit ,Details, Delete, List ) automatically by using Model class and Data context class which we provide and it also generates views for all Action methods. This templates provide good help when we are using entity framework.

 

In this wizard we provided controller Name as HomeController and in template we selected “MVC controller with read/write action and views, using Entity framework“. In model class we selected EmployeeDetail Model which we created while adding entity framework and in Data context class we selected EmployeeDBEntities like as shown below 

 

MVC controller with read/write action and views, using Entity framework

 

Below snapshot show the complete Controller with Action Methods inside it

 

MVC controller with read/write action and views, using Entity framework

 

Following snapshot show of entire project. In this we can see that it created a Home Folder in View and inside that it has created all View with code.

 

After adding MVC controller with read/write action and views, using Entity framework

 

Now let’s move towards next Template.

MVC controller with empty read/write actions

The next template is “MVC controller with empty read/write actions” this template is similar to the previous template “MVC controller with read/write action and views, using Entity framework“ but in this Template it will generate Empty Controller and Action method and no Views are generate in it.

 

MVC controller with empty read/write actions

 

Following is the code snippet of Home Controller with MVC controller with empty read/write actions

 

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.Mvc;

 

namespace MVCDemo1.Controllers

{

public class HomeController : Controller

{

//

// GET: /Home/

public ActionResult Index()

{

return View();

}

//

// GET: /Home/Details/5

public ActionResult Details(int id)

{

return View();

}

//

// GET: /Home/Create

public ActionResult Create()

{

return View();

}

//

// POST: /Home/Create

[HttpPost]

public ActionResult Create(FormCollection collection)

{

try

{

// TODO: Add insert logic here

return RedirectToAction("Index");

}

catch

{

return View();

}

}

//

// GET: /Home/Edit/5

public ActionResult Edit(int id)

{

return View();

}

//

// POST: /Home/Edit/5

[HttpPost]

public ActionResult Edit(int id, FormCollection collection)

{

try

{

// TODO: Add update logic here

return RedirectToAction("Index");

}

catch

{

return View();

}

}

//

// GET: /Home/Delete/5

public ActionResult Delete(int id)

{

return View();

}

//

// POST: /Home/Delete/5

[HttpPost]

public ActionResult Delete(int id, FormCollection collection)

{

try

{

// TODO: Add delete logic here

return RedirectToAction("Index");

}

catch

{

return View();

}

}

}

}

Following is the snapshot of entire project after adding controller with template "MVC controller with empty read/write actions"

 

Asp.net mvc project structure after adding MVC controller with empty read/write actions

 

Now we will learn next template empty api controller.

Empty API controller

ASP.NET Web API is a framework to built Http based service. This template are similar to MVC controller but this controller derived from ApiController. API controller contain various methods in POST, GET, PUT and DELETE and it uses convention over configuration.  Any method starts with Get is automatically mapped with the HTTP GET method and any method that starts with Post is automatically mapped with the HTTP POST method and so on.

 

select empty api controller template in asp.net mvc applicaiton

 

Our controller will contain code like as shown below

 

using System;

using System.Collections.Generic;

using System.Linq;

using System.Net;

using System.Net.Http;

using System.Web.Http;

 

namespace MVCDemo1.Controllers

{

public class HomeController : ApiController

{

 

}

}

API controller with read/write action and views, using Entity framework

 This controller is similar to “MVC controller with read/write actions and views, using Entity Framework”. For using this template we need to add entity framework in your application. In this template we need to select “API controller with read/write actions and views, using Entity Framework” and it will generate code for performing CRUD operations (Create, Read, Update and Delete) with using Entity framework.

 

API controller with read/write actions and views, using Entity Framework

 

Following snapshot show the complete controller with methods inside it

 

Controller after adding API controller with read/write actions and views, using Entity Framework

API controller with empty read/write actions

This template is similar to “API controller with read/write actions and views, using Entity Framework” but this template comes with empty methods (POST, GET, PUT and DELETE).

 

API controller with empty read/write actions

 

Following is the code snippet it generates after selecting template as "API controller with empty read/write actions"

 

using System;

using System.Collections.Generic;

using System.Linq;

using System.Net;

using System.Net.Http;

using System.Web.Http;

 

namespace MVCDemo1.Controllers

{

public class HomeController : ApiController

{

// GET api/home

public IEnumerable<string> Get()

{

return new string[] { "value1", "value2" };

}

// GET api/home/5

public string Get(int id)

{

return "value";

}

// POST api/home

public void Post([FromBody]string value)

{

}

// PUT api/home/5

public void Put(int id, [FromBody]string value)

{

}

// DELETE api/home/5

public void Delete(int id)

{

}

}

}

Advance options in View Template

This option will only arise when we select “MVC controller with read/write action and views, using Entity framework” when we click Advance Options button it will open up a wizard for configuring Layout (Master page) for the view which are going to generate with this Template.

 

MVC controller with read/write action and views, using Entity framework with advance options

 

Following is the snapshot of Advanced Options

 

select advance options in MVC controller with read/write action and views, using Entity framework

 

Finally we completed understanding all controllers in Scaffolding templates in asp.net mvc

 Comments (0)

Be the first to give your valuable feedback

Leave a comment

  • Default Tutlane User