asp.net MVC HtmlHelper How to extend _ Practical tips

Source: Internet
Author: User
Tags closing tag extend static class

Three elements of ASP.net extension method

(1), Static class

As can be seen from the figure below, Inputextension is a static class first;

(2), static method

Since it is a static class, all of its methods are necessarily static methods, such as the public static mvchtmlstring CheckBox ();

(3), this keyword

You can see from the definition of the method name that the first parameter is this HtmlHelper HtmlHelper, which represents the extension of the HtmlHelper class;

Second, through the MVC htmlhelper extension of the example simple description of the expansion steps

Example 1, extended submit

Using System;
Using System.Collections.Generic;
Using System.Linq;
Using System.Web;
Using SYSTEM.WEB.MVC;
Namespace Testmvchelper
{public
  static class Htmlextensions
  {public
    static mvchtmlstring Submit ( This htmlhelper helper, string value)
    {
      var builder = new Tagbuilder ("input");//make the label name we created is input
      Builder. Mergeattribute ("type", "submit"); Add attribute type= "submit"
      Builder. Mergeattribute ("value", value);
      return Mvchtmlstring.create (builder. ToString (tagrendermode.selfclosing));}}

The above example illustrates

(1), in the use of Tagbuilder need to introduce namespace SYSTEM.WEB.MVC.
(2) The name of the Submit method is the one called in the corresponding view. (such as: @Html. Submit ("submit"))
(3), this htmlhelper

Helper adds the Submit method to the HtmlHelper, and value is the text on the submit button that is passed over.
(4), var builder = new Tagbuilder ("input");

Set the label name to input.
(5), builder. Mergeattribute ("type", "submit")

Set label Properties Type= "Submit".
(6), builder.  Mergeattribute ("value", value);

Sets the label submit button value.
(7), tagrendermode.selfclosing

Represents a pattern used to render a self-closing tag (for example, <input/>).
(8), Tagrendermode is an enumeration class, respectively,

Normal(represents the pattern used to render normal text)

Starttag(represents the pattern used to render the start tag (for example,,<tag>))

Endtag(represents the pattern used to render a closing tag (for example,,</tag>)

selfclosing(represents the pattern used to render a self-closing tag (for example, <tag/>).
(9), mvchtmlstring as the return value is to make the return value is not escaped, such as "<" will not be converted to "<."

View to call the

@Html. Submit ("Submit")

Instance 2, extended hyperlink

http://www. Codehighlighter.com/--> 1///<summary>///with a description of the link extension method///</summary>///<param name= "HtmlHelper" > To extend the HtmlHelper class </param>///<param name= "title" > title </param>///<param name= "url" > link address </ param>///<param name= "description" > Description </param>///<returns>html code </returns> Public Static mvchtmlstring linkwithdescription (This htmlhelper htmlhelper, string title, string url, string description) {//  Generates the HTML code associated with the title link Tagbuilder titlecontainer = new Tagbuilder ("P");  Title link container p tagbuilder titlelink = new Tagbuilder ("a");  The text in the title should have a link, so include in the A tag titlelink.mergeattribute ("href", url);  Add the href attribute to a and specify the link address titlelink.setinnertext (title);  Title Text titlecontainer.innerhtml = Titlelink.tostring ();  Place a in P Titlecontainer.addcssclass ("LinkTitle");  Add a style to the title//generate HTML code related to the link description tagbuilder descriptioncontainer = new Tagbuilder ("P");  Connection Description Container P descriptioncontainer.innerhtml = description; Descriptive textCharacter Descriptioncontainer.addcssclass ("Linkdescription");
  Add a style to the description//put the above element in a div tagbuilder div = new Tagbuilder ("div"); Div. InnerHtml = string.

  Format ("{0}{1}", Titlecontainer.tostring (), descriptioncontainer.tostring ()); Returns the generated HTML code return mvchtmlstring.create (Div.
ToString ());
 }

Call in the view

@Html.linkwithdescription ("Test Link 1", "#", "This is the description of the test link 1")

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.