Email: Password:       Forgot Password 
    .netCodeSG
A Saarsha Group Online Community for dot net codes group like C#, Asp.NET, VB.NET, Sharepoint, JavaScript, JQuery, Ajax, SQL, WCF, WPF.
 
TECHNOLOGIES:
 

MVC - An Example of using Model View Controller

Article:
Viewed:  1889 
Posted On:  20/10/2013 09:09:51 
How we can use model, view and controller in a MVC application ? 

In this article I am going to explain how we can use all 3 pillars of MVC. In this example I showing  an employee detail. Let's learn step by step:

Step 1 : Create a New ASP.NET MVC Application.

Step 2 : Add a New Class in Model  name as Employee.cs 

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web; 

namespace
MVC__Model_View_Controller_Simple_Example.Models

{
    public class Employee
    {
        public int Emp_ID { get; set; }
        public string Emp_Name { get; set; }
        public string Emp_City { get; set; }
        public string Emp_Country { get; set; }
    }
}
 

Step 3 :  Now add a Controller GetEmployeeDetailsController.

 

Step 4 : Add Namespace of Model in Conmtroller:
             using MVC__Model_View_Controller_Simple_Example.Models;
 

Step 5 :
 In ActionResult create the object of Model Employee Class.           

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

namespace
MVC__Model_View_Controller_Simple_Example.Controllers

{
    public class GetEmployeeDetailsController : Controller
    {
        //
        // GET: /GetEmployeeDetails/
 
        public ActionResult Index()
        {
            Employee emp = new Employee();

            emp.Emp_ID = 1;
            emp.Emp_Name = "Rahul";
            emp.Emp_City = "Delhi";
            emp.Emp_Country = "India"; 

            return View(emp);
        } 

    }
}

Pass emp as parameter to calling view . . . 
 

Step 6: Now Right Click on to ActionResult add view. 


1.png

Image 1.

 
This View should be strongly- typed view with Model Employee class. . .  

Open View Index.aspx:
 


2.png

Image 2.


My View (Index.aspx) is:
 

<%
@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<MVC__Model_View_Controller_Simple_Example.Models.Employee>" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Index</title>
</head>
<body>
    <div>
        <span style="font-family: Arial; font-size: 10pt; font-weight: bold">Showing Employee
            Details:<br />
            Employee ID:
            <%= Model.Emp_ID %>
            <br />
            Employee Name:
            <%= Model.Emp_Name %>
            <br />
            Employee City:
            <%= Model.Emp_City %>
            <br />
            Employee Country:
            <%= Model.Emp_Country %>
        </span>
    </div>
</body>
</html> 

Run the application and pass your Action Controller in URL:


3.png

Image 3.

  Comment:
         HOME   |   Submit Article   |   Contact Us   |   About Us   |   Terms & Condition   |   Advertise With us