ASP. NET MVC HtmlHelper

  • 2021-07-21 08:22:04
  • OfStack

1. ASP. NET Extension Method 3 Elements

(1) Static classes

As you can see from the following figure, InputExtension is first a static class;

(2) Static method

Since it is a static class, all its methods must be static methods, for example: public static MvcHtmlString CheckBox ();

(3), this keyword

It can be seen from the definition of method name that the first parameter is this HtmlHelper htmlHelper, which represents the extension of HtmlHelper class;

2. Simple explanation of extension steps through MVC HtmlHelper extension example

Example 1, Extending 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 name of the label we created set to input
      builder.MergeAttribute("type", "submit"); // Add Attributes  type="submit"
      builder.MergeAttribute("value", value);
      return MvcHtmlString.Create(builder.ToString(TagRenderMode.SelfClosing)); 
    }
  }
}

The above example illustrates that

(1) The namespace System. Web. Mvc needs to be introduced when using TagBuilder.
(2) The Submit method name is the name of the call in the corresponding view. (e.g. @ Html. Submit ("Submit"))
(3), this HtmlHelper

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

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

Set the label attribute type = "submit".
(6), builder. MergeAttribute ("value", value);

Set the label submit button Value value.
(7), TagRenderMode. SelfClosing

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

Normal (denotes the mode used to render normal text)

StartTag (denotes the opening tag used to render (for example, < tag > ) Mode)

EndTag (denotes the end tag used to render (for example, < /tag > ) Mode)

SelfClosing (for rendering self-ending tags (for example, < tag / > ).
(9), MvcHtmlString is used as the return value so that the return value is not escaped, such as " < "Will not be turned into" & lt ".

Called in View


@Html.Submit(" Submit ")

Example 2, Extending Hyperlinks


http://www.CodeHighlighter.com/--> 1 /// <summary>
///  Link extension method with description 
/// </summary>
/// <param name="htmlHelper"> To be extended HtmlHelper Class </param>
/// <param name="title"> Title </param>
/// <param name="url"> Link address </param>
/// <param name="description"> Describe </param>
/// <returns>HTML Code </returns>
public static MvcHtmlString LinkWithDescription(this HtmlHelper htmlHelper, string title, string url, string description)
{
  //  Object related to the title link HTML Code 
  TagBuilder titleContainer = new TagBuilder("p");  //  Title link container p
  TagBuilder titleLink = new TagBuilder("a");  //  The text in the title should have links , So it is included in the a Inside the label 
  titleLink.MergeAttribute("href", url);  //  For a Add href Property and specify the link address 
  titleLink.SetInnerText(title);  //  Title text 
  titleContainer.InnerHtml = titleLink.ToString();  //  Will a Put p Medium 
  titleContainer.AddCssClass("LinkTitle");  //  Adding Styles to Headings 

  //  Object related to the link description HTML Code 
  TagBuilder descriptionContainer = new TagBuilder("p");  //  Connection description container p
  descriptionContainer.InnerHtml = description;  //  Descriptive text 
  descriptionContainer.AddCssClass("LinkDescription");  //  Adding Styles for Description 

  //  Put the above elements into the 1 A DIV Medium 
  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 Test Link 1")


Related articles: