No-nonsense MVC getting started tutorial 3 [getting started with route settings and views]

Objectives

1. Configure routing rules for global application files

2. Familiar with Razor syntax and HtmlHelper usage

Contents

1. MVC routing settings

2. Razor syntax and usage

3. Use of HtmlHelper

1. There are also a lot of Introduction to MVC routing settings on the Internet. Here we also provide a good article for you to learn. Http://www.cnblogs.com/QLeelulu/archive/2008/10/03/1303612.html

To help you quickly understand routing, I will explain it again in Vernacular:

First, let's look at the following two addresses:

Address 1: http: // localhost/index. aspx: directly access the Index. aspx file in the relative path of the server based on the traditional WebForm.

Address 2: http: // localhost/Home/Index: access through the MVC-based path and access the Index method of the HomeControl class in the Controls folder.

Address 1 is easy to understand because there are physical files. What about address 2? Why does Home correspond to the Control class name? What is the method name corresponding to Index? Here is the role of Route ing. The role of a route is equivalent to interpreting/Home/Index to the MVC framework according to "Custom rules (such as what should the current Home and Control correspond, to process the corresponding program file, as shown in the last figure in my previous article.

2. Razor syntax and a writing rule used to describe the server program on the Razor template.
For example, in MVC2 or traditional WebForm programs, we use <% ** %> to represent server variables. After MVC3 is launched, "@" can be used as a prefix to indicate server variables in the cshtml view.

1. Basic Syntax: Start with "@" symbol + "{code block}" or "@" symbol. The following code is used:

1 <div> 2 @ {3 int id = 100; 4 var ID = 101; 5 string Name = "Capital name"; 6 string Name = "variable case sensitive "; 7} 8 </div> 9 <div> @ id </div> 10 <div> @ ID </div> 11 <div> @ Name </div> 12 <div>> @ name </div> 13 <div> Hi @ name </div>

Note:

• The variable declaration in "{code block}" should end with ";" Semicolon. If you use a variable, add ";" Semicolon.
• "@" Cannot contain any Html characters before the symbol. Otherwise, the variable will be output as a string.
• Like when C # writes a variable in a class, Razor is case sensitive.

2. String concatenation

1 <div> 2 String concatenation: aa @ name bb </div> 3 <div> 4 String concatenation: Begin @ {@ Name} 5 End6 </div>

Note:

• In the first method, do not ignore the space before the @ symbol.

3. Text usage

1 <div> 2 @ {3 <div> 4 internal <br/> 5 text 1 </div> 6 @: internal <br/> text 2 7} 8 </div>

4. Notes

1 <div> 2 @ {3 // comment 1, single line 4 @ * 5 comment 2, multiple lines 6 * @ 7} 8 </div>

5. Loop

1    <div>2         @{3             for (int i = 0; i < 10; i++)4             {5             @:@i6             }7         }8     </div>

6. Special symbols

 1     <div> 2         @{ 3             var Password = @"""123456!@#$%^\"""; 4         } 5     </div> 6     <div> 7         @Password 8     </div> 9     <div>10         @@</div>

Note:

• When double quotation marks are output, an extra double quotation mark escape is required.

7. Overall running effect:

3. HtmlHelper is equivalent to a server-side control in a traditional WebForm. Html tags can be generated, but the syntax is more concise. The following is just a simple introduction to HtmlHelper. In actual development, it will be bound to a strong-type Model, which will be detailed in later articles.

1. Html. TextBox

1 // write method on the server side 2 @ Html. textBox ("txtUserName") 3 // The client generates 4 <input id = "txtUserName" name = "txtUserName" type = "text" value = ""/>

2. Html. Password

1 // Log service method 2 @ Html. Password ("txtPassword") 3 // The client generates 4 <input id = "txtPassword" name = "txtPassword" type = "password"/>

3. Html. Label

1 // Log service method 2 @ Html. Label ("txtUserName", "display value") 3 // The client generates 4 <label for = "txtUserName"> display value </label>

4. Html. DropDownList

1 // Log service method 2 @ {3 // value of the drop-down List 4 List <SelectListItem> selectList = new List <SelectListItem> (); 5 selectList. add (new SelectListItem {Value = "1", Text = "list item 1"}); 6 selectList. add (new SelectListItem {Value = "2", Text = "list item 2"}); 7} 8 @ Html. dropDownList ("ddlList", (SelectList) new SelectList (selectList. asEnumerable (), "Value", "Text ")) 9 // The client generates 10 <select id = "ddlList" name = "ddlList"> <option value = "1"> list item 1 </option> 11 <option value =" 2 "> list item 2 </option> 12 </select>

5. Html. RadioButton

1 // write method on the server side 2 @ Html. radioButton ("rdo", "male") 3 // The client generates 4 <input id = "rdo" name = "rdo" type = "radio" value = "male"/>

6. Html. CheckBox

1 // write method on the server side 2 @ Html. checkBox ("chk ") 3 // The client generates 4 <input id = "chk" name = "chk" type = "checkbox" value = "true"/> <input name = "chk" type =" hidden "value =" false "/>

7. Html. ActionLink

// @ Html. ActionLink ("link Homepage", "Login") // The client generates a <a href = "/User/Login"> link homepage </a>

8. Overall Running Effect

Because there are too many methods, here we will only give a brief introduction to the basics. For details, refer to MSDN:
Http://msdn.microsoft.com/zh-cn/library/system.web.mvc.html

Copyright: http://www.cnblogs.com/iamlilinfeng