ViewEngines in MVC are responsible for generating the HTML from the view ,it does this
by locating the view and rendering it.Views in MVC are templates which contains code and markup. ViewEngines search for the views in specific locations.This is an example of convention over configuration which means that if we follow certain conventions then our application just works.
So the ViewEngine expects the view files to be located in specific folders.ViewEngine searches for a view in the following order:
∼/Views/Controller/ViewName.cshtml
∼/Views/Controller/ViewName.vbhtml
∼/Views/Shared/ViewName.cshtml
∼/Views/Shared/ViewName.vbhtml
After locating the view it is rendered and is returned to the browser.One important thing to remember about views is that the view files are compiled into c# or vb classes at run time.
Two of the main View Engines in MVC are:
- ASPX or WebForms view engine
- Razor View Engine
Both have different syntax.While the web forms views have syntax which is similar to the webforms in ASP.NET ,razor has a more fluent syntax though and is mostly used.Razor is the default view engine in MVC.
We can select the view engine for our view whiling adding a new view in our application
Razor Syntax
Razor has a fluent syntax which allows us to easily transition between code and markup.So while writing code in a razor view we are not forced to use unnecessary language elements.There are few important ways using which we can write code in a razor view.
Code blocks
In razor @ is an important character and is used frequently when writing code.
Code blocks are used to contain single or multiple statements in the view.The code declared in the code block gets executed.The code is contained within the @{ and } as @{ code goes here }
@{ @*razor code block*@ var message = "Hello world!"; }
Notice that each of the statements in the code block ends with a semicolon.
We do not require opening and closing braces { and } while using loops such as foreach
@foreach(var item in lst) { @item }
Inline expressions
Unlike code blocks which executes code, expressions does not execute any code and returns some value which is rendered in the output.Expressions does not end with a semicolon and are often mixed with markup.
<p> Today is @DateTime.Now.Date and time is @DateTime.Now.TimeOfDay </p>
An important feature of the output rendered by razor is that it is HTML encoded.This prevents security vulnerabilities such as cross site scripting attacks.If we do not want to HTML encode the output then we can use the Raw() method as:
@Html.TextBoxFor(m=> m.EmployeeName)
Comments
We can use comments to add additional information to the code or to prevent some code from executing.The comments are not included in the response that is sent to the end user and thus remains only on the server.
To comment some portion of code or markup we use the @* characters:
@* This is a razor comment*@
Apart from using this razor syntax for commenting the code we can use the commenting syntax provided by a specific language.
/*This is a c# comment in a razor view*/
Creating strongly typed view
To create a view which is based on a particular model we use the @model declarations as:
@model IEnumerable<Employees>
Notice that the model starts with lowercase “m”.And when referring to the model we have declared in the view we write @Model as:
@foreach(Employee emp in @Model) { @emp }
Notice that the Model here starts with uppercase “M” unlike the @model statement which we use to define the model for our view.
Importing namespaces in razor view
We can import the required namespaces in the view with Using statement as:
@using System
Special View files
Views/_ViewStart.cshtml The code in this file is executed prior to the code in any view.If we look at the default _ViewStart.cshtml file it contains the following code block:
@{
Layout = “~/Views/Shared/_Layout.cshtml”;
}
The above code sets the Layout section.Since the code in this file is executed prior to the code in any view ,in effect this means that the Layout for every view is set to the above value.This avoids repeating the common code in every view.
Views/Shared/_Layout.cshtml This file defines the common layout for our views.Its similar to the master pages in WebForms
Advantages of Razor
As we have seen razor provides few advantages over other view engines
- We can easily transition between markup and code
- Less typing is required
- Code is easy to read and understand
Leave a Reply