Description
A View Engine is a component in ASP.Net MVC which do the following things.
- Takes the request from the controller's action method.
- Executes the code of the view
- Deliver the result to the client.
Conceptual
figure
The following diagram shows the functionality of the view engine.
- Client will send the request to the IIS server.
- IIS will redirect the client request to the respective Action Method in the controller class.
- Action Method will execute the code by taking the required data from the model.
- The generated result of the Action Method is returned to the appropriate view.
- The View Engine within the view will execute the complete code and the view will render the complete output.
- The Output should be delivered to the client.
Types
Types of View Engines supported by MVC
- Web Forms View Engine (Default)
- Razor View Engine
- Brail View Engine
- Spark View Engine
- NHaml View Engine
- NVelocity View Engine
- NDjango View Engine
- WIng Beats
Description
A Razor is an ASP.Net programming syntax, used to create dynamic web pages. Razor supports two programming languages.
- C#
- VB.Net
Syntax
Razor doesn't support ASP.Net markup syntax i.e enclosing in between <%...%>
Razor syntax will be started with the symbol '@'.
Razor code can be written in 3 ways.
- Single Line Blocks
- MultiLine Blocks
- InLine Blocks
Description
Razor block is represented by @{....}
In Single Line Block, each razor block will contain only one statement.
Example
@{ int a=10; }
@{ double a=10.6; }
@{ string s="Jan"; }
Description
In Multi Line Blocks, each razor block can contain more than one statement.
Example
@{
Layout=null;
int a=10;
double b=56.5;
string s="jan";
}
Description
In InLine Blocks. the razor code is integrated or embedded as part of the HTML as shown below.
[html]
<div>
a=@a
b=@b
s=@s
</div>
[/html]
Razor is completely Light Weight Programming Syntax.
Example to Create an array and print the elements.
Write the following code in the view.cshtml
[html]
@{
ViewBag.Title = "Array Example";
}
@{
Layout = null;
String[] names = new String[4] { "Jan", "James", "Devid", "Loosy" };
}
<h2>Array Example</h2>
<body>
<div>
@foreach(string s in names)
{
@s
}
</div>
</body>
[/html]
Now, write the following code in the HomeController.cs
[csharp]
public ActionResult view()
{
return View();
}
[/csharp]
In the RouteConfig.cs, change the Action Method Name as view and Run the application.
Then, the following output will be displayed in the browser.
Note
To write the comments in the Razor view follow the below syntax. @* Comment 1 Comment 2 Comment 3 *@Note
All the operators, Selection Statements, Conditional Statements and Looping Statements in Razor are same as in C#. Methods
- IsBool()
- IsDateTime()
- IsDecimal()
- IsEmpty()
- IsFloat()
- IsInt()
Methods
- AsBool()
- AsDateTime()
- AsDecimal()
- AsEmpty()
- AsFloat()
- AsInt()
Description
Webforms View Engine is also called as ASPX View Engine. Webforms View Engine is used to write the Traditional ASP.Net Code.
The syntax for the view using ASPX View Engine and the ASPX webforms is same. Extension names like .aspx, .ascx and .master are also same for ASPX View Engine and the ASPX webforms. WebForms View Engine is the default View Engine for the versions MVC 1.0 and MVC 2.0.
Syntax
The code must be in between <%...%> in WebForms View Engine.
Disadvantage
Unit Testing is very difficult in WebForms View Engine Description
There are two types of coding mechanisms in the WebForms View Engine.
- Single Line Blocks
- Multi-Line Blocks
Description
In Single Line Block, Only one statement resides for each Percentile Block <% %>
Example
Follow the below steps to demonstrate about the Single Line Blocks.
- Open the Visual Studio 2013
- Create an MVC Application. Follow the below steps to create MVC Application.
- Go to File->New->Project
- Then, the New Project window will appear. Follow the steps mentioned in the below figure.
- Then, another window will appear. Select the View Engine as shown in the below figure.Click on Ok.
- Go to Solution Explorer->Views.
- Right Click on the Views and then go to Add->View and give the name as Sample. Write the following code in the Sample.aspx.
- Go to Solution Explorer->Controllers->Double Click on the HomeController.cs
- Write the following code under the HomeController.cs.
- Go to RouteCongig.cs and change the Action name as Sample.
- Press f5 to run the application.
- Then the following output will appear in the browser.
Description
In Multi Line Block, Each Percentile Block <% %> will contain more than one statement.
Syntax
<% Statement 1;
Statement 2;
Statement 3;%>
Example
Go to Solution Explorer->Views. Right Click on the Views and then go to Add->View. Then the new window will appear. Give the Name as Example. Write the following code in the Example.aspx.
[html]
<h2>Multi Line Block Example</h2>
<div>
<%int[] Numbers = new int[6] { 1, 2, 3, 4, 5, 6 }; foreach (int N in Numbers) { Response.Write(N + "&lt;br&gt;"); } >
</div>
[/html]
- Go to Solution Explorer->Controllers. Right click on the Controllers folder and then go to Add->Controller. Give the Name for the controller as HomeController and click on Add.
- Write the following code under the HomeController.cs.
- Go to RouteCongig.cs and change the Action name as Example.
- Press f5 to run the application.
- Then the following output will appear in the browser.
Note
Above Applications are implemented in ASP.Net MVC 4.0. Because, ASP.Net MVC 5 implemented fully in updated product of Visual Studio 2013. For more information refer the following site. http://blogs.msdn.com/b/webdev/archive/2013/06/27/html-editing-features-in-visual-studio-2013-preview.aspx Table
The following are the main comparisons between Razor View Engine and the ASPX View Engine.
| Razor View Engine | ASPX View Engine |
|---|---|
| View page will have a default extension of .cshtml or vbhtml | View page will have a default extension of .ASPX |
| Supports two programming languages C#.Net and VB.Net | Supports two programming languages C#.Net and VB.Net |
| programming code is written as @{Code} | Programmin code is written as |
| Support Single Line and Multy-Line comments. //for single line comments @* for multy-line comments*@ | Supports Single Line and Multi-Line comments. //For Single Line Comments /* For multi-line Comments*/ |
| Light Weight Programming Model. | Heavy Weight Programming Model. |
| Class to use Razor View Engine is System.Web.MVC.RazorViewEngine | Class to use Razor View Engine is System.Web.MVC.WebformsViewEngine |
| Contains a separate a Name Space. System.web.MVC.Razor | Does not Contain a separate a Name Space. |
| Developing Application at a faster rate. | Developing Application at a slower rate. |
| Supports 3 ways of coding. · Single Line Coding Blocks · Multi Line Coding Blocks · In Line Coding Blocks | Supports 2 ways of coding. · Single Line Coding Blocks · Multi Line Coding Blocks |
| Included in MVC 3.0 version. So, supports MVC 3, MVC 4 and MVC 5versions only. | Available from beginning of MVC. So, supports all the versions of MVC. |
| Supports Layout Pages similar to Master pages. | Supports Master Pages. |
| Supports HTML Helper Classes. | Supports HTML Helper Classes. |
| Supports TDD (Test Driven Development). | Does not Supports TDD (Test Driven Development). |
| Supports one Transitional Character. | Supports three Transitional Characters. |