How to create a simple ASP.net MVC 2 empty web application and how to pass data from model to View?
Are you new to MVC 2.0? Then this article surely help you to understand MVC concept. How to pass data from model to view? How to use controller class in MVC etc. You can have various helper classes as well to reduce manual efforts. It depends on developer how to use MVC in a better way.
Description MVC stands for Model-View-Controller. If I want to put code separate from UI then I must use MVC for my application. In this article, we will create model , view and controller and will increase efficiency of our application.
Steps – How to pass data from model to View in MVC 2.0?
1
Open Visual studio 2010 and Go to File->New Project -> Select "ASP.net MVC 2 empty web application" and give proper name to it. Say "MvcModelToView". This will create complete structure where you will find empty controllers folder , Views folder , Models folder etc.
2 Right Click on "Models" folder. Add class file to it. Lets say name of the class file is "Students.cs".
Put following code to it.
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
namespace MvcModelToView.Models
{
public class Students
{
public int rollnumber { set; get; }
public string firstname { set; get; }
public string lastname { set; get; }
}
}
I have added rollnumber , firstname , lastname properties with set and get methods.
3 Right Click on Controllers folder and add Controller in it. It will create "MvcModelToViewController.cs" Put following code in it.
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using MvcModelToView.Models;
namespace MvcModelToView.Controllers
{
public class MvcModelToViewController : Controller
{
public ActionResult Index()
{
Students std = new Students();
std.rollnumber = 1;
std.firstname = "Suman";
std.lastname = "Joshi";
return View(std);
}
}
}
We are passing object std i.e. object of Model to View.
All the values we have hardcoded because we want to have sample data. You can bind this data with different input controls like textboxes , labels etc as well. This will be used for dynamic data generation. Note- Make sure you have added "using MvcModelToView.Models;" statement to it.
4
When you right click on Index statement above, you can add "View" for our application. Add view to have "MvcModelToView" folder inside Views and in that you will find "Index.aspx"
When you add view that time checkbox "Create strongly-typed view" should be checked and select "MvcModelToView.Models.Students" inside view data class.
Uncheck "select master page" checkbox and then click "Add".
Please note that there is no Index.aspx.cs associated with it because all actions will be controlled by controller class.
Add this code to Index.aspx
<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<MvcModelToView.Models.Students>" %>
<!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>
Student rollnumber is <%= Model.rollnumber %> <br />
Student's first name is <%= Model.firstname %> <br />
Student's last name is <%= Model.lastname %>
</div>
</body>
</html>
5
When you run the application, you will find error because url will be "http://localhost:portnumber/"
You need to have url with namespace.
For e.g http://localhost:portnumber/mvcModelToView This will give you correct output. You will find values of rollnumber , firstname , lastname as hardcoded in our code.