Scaffolding In MVC 5

Introduction

It is nothing but automatic code generation framework of ASP.NET web application. It generates code for CRUD operations using the Entity Framework models. This is a simple way to create an ASP.NET MVC application with all the operations. Using this feature you can define any new learner to understand the MVC CRUD operations in a short time. We are using Visual Studio 2013 MVC 5 and Web API with Entity Framework.

The following are the steps for creating an application with ASP.NET scaffolding feature of MVC 5:

1. Open Visual Studio 2013.
   
   
2. Select Menu File, then New Project.
   
   
3. Select Web, ASP.NET Web Application and Name it ‘ScaffoldingInMVC5’ - Click OK. See the following image for same:
   
   
   
   
4. Next it will open for the selected template like the following:
   
   
   
   
5. Now our MVC 5 application is created, Next adding Entity Data Model for accessing data from the database using Entity Framework. For reference read my article Database First Approach in Entity Framework and how to add entity data model.
   
   
   
   
6. Add Entity Data Model like the following sequence:
   
   
   
   It will open next window like the following for adding new item, means for Entity Data Model we are adding for accessing data from the database.
   
   
   
   After clicking add it will open database connection wizard. I will be skipping this step, if you want to see how to connect read my article Database First Approach in Entity Framework. The database is already present with data.
   
   
   
   The above image you saw after adding the Entity Data Model, under the Models folder with name ‘EmployeeModel’. Rebuild the application.
   
   
7. Now finally our data is ready, now time to auto generate the CRUD operation code.
   
   
8. For opening Solution Explorer - Right Click on Controller Folder, Add, then Add New Scaffolded Item.
   
   
   
   
9. It will prompt another window with Add Scaffold option like MVC -
   
   
   1. Area
   2. Controller
   3. View.
   
   Here we are selecting MVC 5 Controller with Views, using Entity Framework option.
   
   
   
   
10. After clicking on Add it will ask you the name of controller like for the following image I entered ‘EmployeeController’.
    
    
    
    Next, Select model class means table name for generating the CRUD code. Here we are selecting ‘Employee’ class.
    
    
    
    Next, we are selecting the data context from the previously added Entity Data Model context.
    
    
    
    After selecting all these three you can see the following image: 
    
    
    
    
11. After clicking on add you will see the following image means adding scaffolding to the application.
    
    
    
    
12. Now, open the solution explorer and you can see the following image in that auto generated views with controller and CRUD operation.
    
    
    
    
13. Next, build the application.
    
    
14. To check the application open _Layout.cshtml file and add the link for newly created controller ‘Employee’ like the following :
    
    
    
    
15. Rebuild the application and click on Run or Press F5.
    
    
16. It will show running application like the following:
    
    
    
    
17. Now, next click on Employee link it will show you the output of Employee Index.cshtml page like the following:
    
    
    
    In the above image you can see the auto generated view of listing Employees. You can see various links like Create New, Edit, Details and Delete.
    
    
18. If you click on Create link you can see the following output:
    
    
    
    The above is the employee creation page.
    
    
19. Next, Click on Edit link it will show you the output for editing the employee:
    
    
    
    
20. Next, Click on Details link and it will show you the output like the following employee details page:
    
    
    
    
21. Next, click on Delete link it will show you the output like following image with delete button:
    
    

Congratulation! We successfully implemented the ASP.NET Scaffolding feature of MVC  5.

Summary

I hope that beginners as well as students understood ASP.NET Scaffolding feature of MVC 5 with example. If you have any suggestions regarding this article, then please contact me.

Learn It, Share It!