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