Asp.net MVC View

1. After the MVC framework is upgraded to version 3, the razor engine is dominant. The simple Syntax of razor is as follows:

@ Variable

@ Object. Attribute

@{//CodeSegment}

{@: Text in the code snippet}

{<Text> the code segment contains a large number of texts </text>}

@ If () {// code segment}

 To add dynamic content to a view, you can use the following methods: A, Inline code; B, HTML helper; C, and partial view. Next we will discuss each method separately.

2. Inline code

2.1 introduce namespace in view: @ using project. models. This method can introduce the namespace to this independent view. If you want to introduce the same namespace in each view, you can use the web in the Views folder. modify the configuration in the config (note, not under a directory) file as follows:

<System. Web. webpages. Razor>  "  System. Web. MVC. mvcwebrazorhostfactory, system. Web. MVC, version = 3.0.0.0, culture = neutral,  Publickeytoken = 31bf3856ad364e35 " /> <Pages pagebasetype = "  System. Web. MVC. webviewpage  " > <Namespaces> <add Namespace = "  System. Web. MVC  " /> <Add Namespace = "  System. Web. MVC. Ajax  " /> <Add Namespace ="  System. Web. MVC. html  " /> <Add Namespace = "  System. Web. Routing  " /> <Add Namespace = "  Project. Models  " </Namespaces> </pages> </system. Web. webpages. Razor>

 

2.2 understand razor HTML string Encoding

Assume there is a class

 
 Public ClassClassa {Public StringMymethod (){Return "<Form> This Is A form! </Form>";}}
 

 

If @ classa. mymethod () is referenced in the page, the return value of this method will be automatically encoded as "& lt; Form & gt; this is a form! & Lt; Form & gt ;". The MVC framework is designed to ensure page security. However, ifProgramThe MVC framework can also be used to return a form like this method. You can write the following code: return New mvchtmlstring ("<form> This Is A form! </Form> ");

3. Use HTML helper

3.1 create an inline HTML helper Method

 @ {Viewbag. Title = "  Index  "  ;} @ Helper createlist ( String  [] Items ){ <Ul> @ Foreach (  String Item In  Items ){ <Li> @ item </LI> } </Ul> } <P> fruits I like: </P> @ * Call it below * @ Createlist (  New   String [] {"  Apple  " , "  Grapefruit  " , "  Strawberry  " , "  Dragon fruit  " })

3.2 Create an external HTML helper Method

If you create an HTML helper in a row, you can only use this method on a specific page. If you want to create an HTML helper method that can be used for any page, you can write an extension method, the first parameter must be htmlhelper, and the returned value is mvchtmlstring. As shown below

  Public   Static   Class  Helperclass {  Public   Static Mvchtmlstring list ( This Htmlhelper helper, String  [] Listitems) {tagbuilder ultag = New Tagbuilder ( "  Ul  "  );  Foreach ( String Item In  Listitems) {tagbuilder litag = New Tagbuilder ( "  Li  " ); Litag. setinnertext (item); ultag. innerhtml + = Litag. tostring ();}  Return   New  Mvchtmlstring (ultag. tostring ());}} 

@ * Call below *@

@ * First introduce the namespace where helperclass is located *@

@ Using mvcarea1.models @ {viewbag. Title="Index";} @ Html. List (New String[] {"Apple","Grapefruit","Strawberry","Dragon fruit"})
 

3.3 Use the built-in HTML helper method of MVC Framework

A. Create a form.

 
@ Using (@ html. beginform ()){
}
 

 

B. Create input helper.

 

Another interesting thing is that if I set viewbag. Message = "Hello, world! ", And then enter @ html. Textbox (" message ") in the page. The following HTML code is generated:

<Input id = "message" name = "message" type = "text"Value = "Hello, world! "/> </Form>

The MVC framework looks for viewbag. Message, viewdata ["message"], @ model. message. If the value of the message attribute is found, the Value Attribute of the text box is assigned.

 

C. Use a strongly typed input helper.

D. Use the list helper

 

E. Use a URL or hyperlink

4. Use Section

Section is an HTML code segment, which is defined in a view and referenced on the layout page. For example:

First, reference

 @ {Viewbag. Title = "  Index  "  ;} <H2> index </H2> @ Section footer { <H4> it ' S footer here! </H4>  } Then reference it on the layout page. <! Doctype HTML>  "  @ URL. Content (  " ~ /Content/site.css "  )  " Rel = "  Stylesheet  " Type = "  Text/CSS  " /> <SCRIPT src = "  @ URL. Content (  " ~ /Scripts/jquery- 1.4 . 4 . Min. js "  )  " Type = "  Text/JavaScript  " > </SCRIPT>  @ Renderbody () @ rendersection (  "  Footer "  ) </Body> 
 
 
 

 
 

 
5. Use partialpage
 

 
Select the folder of a type of view in the Views directory, right-click and select Add => View. On the displayed page, select "create as" branch view.
 

 
 

 
Add the required HTML elements to the new page and reference them on other pages. The reference method is as follows:
 

 
@ Html. Partial ("mypartial ")
 

The partial view can also be created as a strong type. The specific operation is not described here. The method is the same as that for creating a strong type page. During reference, @ html. Partial has a heavy-duty version for the strong type.