Scaffoldcoloumn in ASP.NET MVC

Using Scaffoldcoloumn in ASP.NET MVC application

In the previous chapters, in view we have used Scaffold templates as empty. In this chapter we will see how to use Scaffold templates as Details with strongly typed view.

The first step is to create entity data model using entity framework. For detail information please see the chapter ADO.NET Entity Data Model.

After creating the Entity Data Model you will get autogenerated classes. We have given name as EmployeeDBContext in the data connection wizard at save entity connection settings in web.config section. So you will get the class as follows.

EmployeeDataModel.Context.cs file

namespace MvcDetail.Models
{
    using System;
    using System.Data.Entity;
    using System.Data.Entity.Infrastructure;
    
    public partial class EmployeeDBContext : DbContext
    {
        public EmployeeDBContext()
            : base("name=EmployeeDBContext")
        {
        }    
        protected override void OnModelCreating(DbModelBuilder modelBuilder)
        {
            throw new UnintentionalCodeFirstException();
        }    
        public virtual DbSet<tblEmp> tblEmps { get; set; }
    }
}


This class has an important auto generated property tblEmps that returns the DbSet<tblEmp>

Now create the controller and name as HomeController. Update the controller as given below.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using MvcDetail.Models;

namespace MvcDetail.Controllers
{
    public class HomeController : Controller
    {       
        public ActionResult Details(int id)
        {
            EmployeeDBContext db = new EmployeeDBContext();
            tblEmp emp=db.tblEmps.Single(x => x.EmpID == id);
            return View(emp);
        }

    }
}


EmployeeDBContext class is available in MvcDetail.Models namespace. So you have to use this class explicitly in controller. When we pass the ID of an employee, it will return the record of that employee.
Now right click on Details action method and add view with following points keep in mind.

points

Details.cshtml file

@model MvcDetail.Models.tblEmp
@{
    ViewBag.Title = "Details";
}
<div style="font-family:Arial; font-size:medium; color:darkblue">
    <h2>Employee Details</h2>
    <fieldset>
        <legend>tblEmp</legend>

        <div class="display-label">
            @Html.DisplayNameFor(model => model.EmpID)
        </div>
        <div class="display-field">
            @Html.DisplayFor(model => model.EmpID)
        </div>
        <div class="display-label">
            @Html.DisplayNameFor(model => model.Name)
        </div>
        <div class="display-field">
            @Html.DisplayFor(model => model.Name)
        </div>
        <div class="display-label">
            @Html.DisplayNameFor(model => model.Gender)
        </div>
        <div class="display-field">
            @Html.DisplayFor(model => model.Gender)
        </div>
        <div class="display-label">
            @Html.DisplayNameFor(model => model.Salary)
        </div>
        <div class="display-field">
            @Html.DisplayFor(model => model.Salary)
        </div>
        <div class="display-label">
            @Html.DisplayNameFor(model => model.Address)
        </div>
        <div class="display-field">
            @Html.DisplayFor(model => model.Address)
        </div>
        <div class="display-label">
            @Html.DisplayNameFor(model => model.DEPID)
        </div>
        <div class="display-field">
            @Html.DisplayFor(model => model.DEPID)
        </div>
    </fieldset>
    <p>
        @Html.ActionLink("Edit", "Edit", new { /* id=Model.PrimaryKey */ }) |
        @Html.ActionLink("Back to List", "Index")
    </p>
</div>


Run the above application, you will find the output as below.

scaffoldcoloumn

Please keep in mind that use address as http://localhost:61185/home/details/1  in your bowser address bar. The port no will probably different.

When you first run the application without appending home/details/1, you will get the error message that “resource is not found”. So you have to append it explicitly. If you pass the ID at address bar is 2, then you will get the information about employee whose id is two.