How to Access Your Model Data in .NET MVC With Razor Engine for Beginners

It may be a little frustrating to start your first MVC application using Razor engine, especially if you have never used it before. Here are some interesting pointers for beginners:

First, when you created your first solution, Visual Studio will create a default structure for you, depending on which option you choose during creating your project. It will look different from what you are used to in your aspx engine project, although the directory structure will be the same and you will still have to follow all the rules of MVC for naming and placing files.

With Razor engine, you do not use master pages, you rather create Layouts. These are just like master pages, except that instead of having ContentPlaceholders, you simply add a @RenderBody() statement that will output your view wherever you place that statement. You have to specify which layout you are going to use in your view by assigning the path to your layout to the Layout property, for example:

Layout = "~/Views/Shared/_Layout.cshtml";

It’s also interesting to notice that with Razor engine you can create a property of the ViewBag on the fly – no need to define it anywhere, it works just like in javascript – you assign it, and it’s there:

ViewBag.MyAwesomeProperty = "Wow! I just created a property!";

Now, assuming you know enough about the MVC architecture, how do you access the properties of your model? First, let’s define one:

namespace MyProject.Models.Home
{
	public class Index
	{
		public string HelloWorld { get { return "Hello World!"; } }
	}
}

Now that we got a property which returns the Hello World string, let’s go ahead and modify the MyProject.Views.Home.Index.cshtml file to output it:

@model MyProject.Models.Home.Index

@{
    ViewBag.Title = "My Hello World Page";
}

<p>
	@Model.HelloWorld
</p>

Now, things to note here are: first, you need to specify which model this view uses with @model statement. In our case, it’s MyProject.Models.Home.Index. We then set the page title via ViewBag.Title property and, finally, output the property value by calling @Model.HelloWorld.

All were good if not for when you run your project, you get an error that HelloWorld property does not exist in the model. This is because aside from specifying which model the view uses, you also need to explicitly specify the model when creating a view in the controller:

using System.Web.Mvc;

namespace MyProject.Controllers
{
	public class HomeController : Controller
	{
		public ActionResult Index()
		{
			return View(new Models.Home.Index());
		}
	}
}

Visual Studio, by default, will create the Index action, but it will look like this:

return View();

In order to access your model properties, you need to pass an instantiated Model object to the View.
Well, that’s really all that is to it!

This entry was posted in MVC and tagged , , , , , , , . Bookmark the permalink.

Leave a Reply

Your email address will not be published. Required fields are marked *