Kumar
10366
0
6/17/2012 (IST)
0
ASP.NET MVC 3 introduces Razor view engine, which simplifies the current syntax used in the ASP.NET web pages. It is used to create dynamic web pages using C# or VB languages.
To read the first two articles, their links are given below
Learn Asp.Net MVC 3 Razor Part-II : Make VS2010 Environment Ready For MVC 3
The main idea behind introducing razor is
- To enable a fluid coding workflow in web pages with simple, compact and expressive syntax.
- It is not a new programming language but uses either C# or VB code syntax like ASP or PHP.
- It is unit testable.
- Works with any text editor like notepad.
- It also has great intellisense when used with VS 2010.
- Supports layouts (like master pages in ASP.NET)
It does not use ASP.NET delimiter:<%= %>, where as it uses '@' a single letter for the single code line/value. The extension for razor file for C# language is '.cshtml' and VB language is '.vbhtml'
Fundamentals of Razor syntax
| Syntax | cshtml | vbhtml |
|---|---|---|
| single code line/values |
<p>
Current time is: @DateTime.Now
</p>
|
<p>
Current time is: @DateTime.Now
</p>
|
| Multiple code line blocks |
@{
var name = "Codemyne";
var nameMessage = "Hello, my name is " + name + " ";
}
|
@Code Dim name = "Codemyne" Dim nameMessage = "Hello, my name is " + name + " " End Code |
| Single plain text to be rendered in the page |
@{
@:The day is: @DateTime.Now.DayOfWeek. It is a <b>funny</b> day!
}
|
@Code
@:The day is: @DateTime.Now.DayOfWeek. It is a <b>funny</b> day!
End Code
|
| Code instruction inside HTML |
@if(IsPost) { <p>Hello, the time is @DateTime.Now and this page is a postback!</p> } else { <p>Hello, today is: </p> @DateTime.Now } |
@If IsPost Then @<p>Hello, the time is @DateTime.Now and this page is a postback!</p> Else @<p>Hello, today is: </p> @DateTime.Now End If |
Conditionals and loops with inline HTML
| Syntax | cshtml | vbhtml |
|---|---|---|
| If (Single line) |
<p>Single line If</p> @if(result != ""){ <p>Result: @result</p> } |
<p>Single line If</p> @If result <> "" Then @<p>Result: @result</p> End If |
| If else statement |
<p>Code block If-else</p> @{ var showToday = false; if(showToday){ @DateTime.Today; } else{ <text>wrong!</text> } } |
<p>Code block If-else</p> @Code Dim showToday = false If showToday Then @DateTime.Today Else @<text>wrong!</text> End if End Code |
| foreach (single line) |
<p> Single Line Foreach </p> <ul> @foreach (var myItem in Request.ServerVariables) { <li>@myItem</li> } </ul> |
<p> Single Line Foreach </p> <ul> @For Each myItem in Request.ServerVariables @<li>@myItem</li> Next myItem </ul> |
| Code block Foreach |
<p> Code block Foreach </p>
@{
<h3>Team Members</h3> string[] teamMembers =
{"Matt", "Joanne",
"Robert", "Nancy"};
foreach (var person in teamMembers)
{
<p>@person</p>
}
}
|
<p> Code block Foreach </p> @Code @<h3>Team Members</h3> Dim teamMembers() As String = {"Matt", "Joanne", "Robert", "Nancy"} For Each person in teamMembers @<p>@person</p> Next person End Code |
| While statement |
@{
var countNum = 0;
while (countNum < 50) {
countNum += 1;
<p>Line #@countNum: </p>
}
}
|
@Code
Dim countNum = 0
Do While countNum < 50
countNum += 1
@<p>Line #@countNum: </p>
Loop
End Code
|
| Comments |
@*
A Razor Comment
*@
@{
//A C# comment
/* A Multi
line C# comment
*/
}
|
@*
A Razor Comment
*@
@Code
//A C# comment
/* A Multi
line C# comment
*/
End Code
|
Creating First MVC 3 Razor application is explained in next article. I hope you find this is helpful.
Comments/Suggestions are invited. Happy coding......!
Comments Post a Comment