ASP. net mvc HtmlHelper usage

Source: Internet
Author: User
Tags actionlink

All methods of the HTML extension class have two parameters:
Using textbox as an Example
Public static string TextBox (this HtmlHelper htmlHelper, string name, Object value, IDictionary <string, Object> htmlAttributes)
Public static string TextBox (this HtmlHelper htmlHelper, string name, Object value, Object htmlAttributes)
These two parameters represent the attribute set of the html Tag. The usage is as follows.
 
1. ActionLink
<% = Html. ActionLink ("this is a connection", "Index", "Home") %>
Writing Method with QueryString
<% = Html. ActionLink ("this is a connection", "Index", "Home", new {page = 1}, null) %>
<% = Html. ActionLink ("this is a connection", "Index", new {page = 1}) %>
Other Html attributes
<% = Html. ActionLink ("this is a connection", "Index", "Home", new {id = "link1"}) %>
<% = Html. ActionLink ("this is a connection", "Index", null, new {id = "link1"}) %>
QueryString and Html attributes exist simultaneously
<% = Html. ActionLink ("this is a connection", "Index", "Home", new {page = 1}, new {id = "link1"}) %>
<% = Html. ActionLink ("this is a connection", "Index", new {page = 1}, new {id = "link1"}) %>
 
The generated result is:
<A href = "/"> This is a connection </a>
Writing Method with QueryString
<A href = "/? Page = 1 "> This is a connection </a>
<A href = "/? Page = 1 "> This is a connection </a>
Other Html attributes
<A href = "/? Length = 4 "id =" link1 "> This is a connection </a>
<A href = "/" id = "link1"> This is a connection. </a>
QueryString and Html attributes exist simultaneously
<A href = "/? Page = 1 "id =" link1 "> This is a connection </a>
<A href = "/? Page = 1 "id =" link1 "> This is a connection </a>
 
2. RouteLink
The function is the same as that of ActionLink.
<% = Html. RouteLink ("about", "about", new {}) %>
With QueryString
<% = Html. RouteLink ("about", "about", new {page = 1}) %>
<% = Html. RouteLink ("about", "about", new {page = 1}, new {id = "link1"}) %>
 
Result:
<A href = "/about"> about </a>
<A href = "/about? Page = 1 "> about </a>
<A href = "/about? Page = 1 "id =" link1 "> about </a>
3. Form two methods
<% Using (Html. BeginForm ("index", "home", FormMethod. Post) {%>
<% }%>
 
<% Html. BeginForm ("index", "home", FormMethod. Post); // note that no = output %>
<% Html. EndForm (); %>
 
Result:
<Form action = "/home/index" method = "post"> </form>
4. TextBox, Hidden,
<% = Html. TextBox ("input1") %>
<% = Html. TextBox ("input2", Model. CategoryName, new {@ style = "width: 300px;"}) %>
<% = Html. TextBox ("input3", ViewData ["Name"], new {@ style = "width: 300px;"}) %>
<% = Html. TextBoxFor (a => a. CategoryName, new {@ style = "width: 300px;"}) %>
 
Result:
 
<Input id = "input1" name = "input1" type = "text" value = ""/>
<Input id = "input2" name = "input2" style = "width: 300px;" type = "text" value = "Beverages"/>
<Input id = "input3" name = "input3" style = "width: 300px;" type = "text" value = ""/>
<Input id = "CategoryName" name = "CategoryName" style = "width: 300px;" type = "text" value = "Beverages"/>
 
5. TextArea
<% = Html. TextArea ("input5", Model. CategoryName, 3, 9, null) %>
<% = Html. TextAreaFor (a => a. CategoryName, 3, 3, null) %>
 
Result:
<Textarea cols = "9" id = "input5" name = "input5" rows = "3"> Beverages </textarea>
<Textarea cols = "3" id = "CategoryName" name = "CategoryName" rows = "3"> Beverages </textarea>
 
6. CheckBox
<% = Html. CheckBox ("chk1", true) %>
<% = Html. CheckBox ("chk1", new {@ class = "checkBox"}) %>
<% = Html. CheckBoxFor (a => a. IsVaild, new {@ class = "checkBox"}) %>
 
Result:
 
<Input checked = "checked" id = "chk1" name = "chk1" type = "checkbox" value = "true"/> <input name = "chk1" type = "hidden "value =" false "/>
 
<Input class = "checkBox" id = "chk1" name = "chk1" type = "checkbox" value = "true"/> <input name = "chk1" type = "hidden "value =" false "/>
 
<Input checked = "checked" class = "checkBox" id = "IsVaild" name = "IsVaild" type = "checkbox" value = "true"/> <input name = "IsVaild "type =" hidden "value =" false "/>
 
7. ListBox
<% = Html. ListBox ("lstBox1", (SelectList) ViewData ["Categories"]) %>
<% = Html. ListBoxFor (a => a. CategoryName, (SelectList) ViewData ["Categories"]) %>
 
Result:
<Select id = "lstBox1" multiple = "multiple" name = "lstBox1">
<Option value = "1"> Beverages </option>
<Option value = "2"> Condiments </option>
<Option selected = "selected" value = "3"> Confections </option>
<Option value = "4"> Dairy Products </option>
<Option value = "5"> Grains/Cereals </option>
<Option value = "6"> Meat/Poultry </option>
<Option value = "7"> Produce </option>
<Option value = "8"> Seafood </option>
</Select>
<Select id = "CategoryName" multiple = "multiple" name = "CategoryName">
<Option value = "1"> Beverages </option>
<Option value = "2"> Condiments </option>
<Option value = "3"> Confections </option>
<Option value = "4"> Dairy Products </option>
<Option value = "5"> Grains/Cereals </option>
<Option value = "6"> Meat/Poultry </option>
<Option value = "7"> Produce </option>
<Option value = "8"> Seafood </option>
</Select>
 
8. DropDownList
<% = Html. DropDownList ("ddl1", (SelectList) ViewData ["Categories"], "-- Select One --") %>
<% = Html. dropDownListFor (a =>. categoryName, (SelectList) ViewData ["Categories"], "-- Select One --", new {@ class = "dropdownlist"}) %>
 
Result:
<Select id = "ddl1" name = "ddl1">
<Option value = ""> -- Select One -- </option>
<Option value = "1"> Beverages </option>
<Option value = "2"> Condiments </option>
<Option selected = "selected" value = "3"> Confections </option>
<Option value = "4"> Dairy Products </option>
<Option value = "5"> Grains/Cereals </option>
<Option value = "6"> Meat/Poultry </option>
<Option value = "7"> Produce </option>
<Option value = "8"> Seafood </option>
</Select>
<Select class = "dropdownlist" id = "CategoryName" name = "CategoryName">
<Option value = ""> -- Select One -- </option>
<Option value = "1"> Beverages </option>
<Option value = "2"> Condiments </option>
<Option value = "3"> Confections </option>
<Option value = "4"> Dairy Products </option>
<Option value = "5"> Grains/Cereals </option>
<Option value = "6"> Meat/Poultry </option>
<Option value = "7"> Produce </option>
<Option value = "8"> Seafood </option>
</Select>
 
9. Partial View Template
Webform is called a custom control. All functions are for reuse. However, it is really difficult to use custom controls.
<% Html. RenderPartial ("DinnerForm"); %> check whether there is no equal sign

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.