Necesita ayuda para crear Custom Html Helper para Asp.net MVC

Question

He estado jugando con algunos helpers personalizados y ahora estoy tratando de crear uno que pueda usar para las pestañas UQ jquery AJAX.

Así que para hacer pestañas ajax es necesario tener este formato en el código HTML

<div id="example"> 
    <ul> 
     <li><a href="ahah_1.html"><span>Content 1</span></a></li> 
     <li><a href="ahah_2.html"><span>Content 2</span></a></li> 
     <li><a href="ahah_3.html"><span>Content 3</span></a></li> 
    </ul> 
</div> 

por lo que no se puede utilizar ActionLink porque no creo que pueda añadir la etiqueta de todos modos a la ActionLink.

Así que quiero hacer mi propio helper html que tenga un actionLink con una etiqueta span y posiblemente construirlo más adelante para tener una etiqueta listada con él.

Así que no estoy seguro de cómo usar ActionLink para mi beneficio. Al igual que ActionLink tiene 10 métodos sobrecargados y no quiero volver a crear los 10, ya que parece inútil. Entonces, ¿puedo hablar de eso o algo así?

Estoy usando la manera que permite que mis ayudantes html personalizados se muestren cuando haces "Html". en intellisense

, por ejemplo, tendría:

public static string Button(this HtmlHelper helper, string id, string value) 

Así que no estoy seguro de cómo hacer uso de este HtmlHelper estoy pasando en

Asimismo, no entiendo esta parte de la línea de. codifique "este Ayudante HtmlHelper".

Lo que me confunde es el uso de la palabra clave "this" en el parámetro. No estoy seguro de a qué se refiere y por qué lo necesita. Tampoco entiendo cómo al pasar este parámetro pero no usarlo de alguna manera permite a sus clientes Html helpers ser accedidos por "Html".

Gracias

Answer 1

Marc's answer es excelente.Simplemente añadiendo algún código:

1) Crear clase estática con su ayudante:

public static class MyHtmlHelpers 
{ 
    public static string MySpecialActionLink(this HtmlHelper htmlHelper, string linkText, string actionName, object routeValues) 
    { 
     var innerTagBuilder = new TagBuilder("span") { 
      InnerHtml = (!String.IsNullOrEmpty(linkText)) ? HttpUtility.HtmlEncode(linkText) : String.Empty 
     }; 

     TagBuilder tagBuilder = new TagBuilder("a") { 
      InnerHtml = innerTagBuilder.ToString(TagRenderMode.Normal); 
     }; 

     var urlHelper = new UrlHelper(html.ViewContext.RequestContext); 
     var url = urlHelper.Action(actionName, routeValues); 
     tagBuilder.MergeAttribute("href", url); 

     return tagBuilder.ToString(TagRenderMode.Normal); 
    } 
} 

2) Agregar espacio de nombres de la clase MyHtmlHelpers a web.config:

<pages> 
    <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="System.Linq" /> 
    <add namespace="System.Collections.Generic" /> 

    <add namespace="MyHtmlHelpers_Namespace" /> 
    </namespaces> 
</pages> 

3) Disfruta :):

<div id="example"> 
    <ul> 
     <li><%= Html.MySpecialActionLink("Content 1", "action1", null) %></li> 
     <li><%= Html.MySpecialActionLink("Content 2", "action2", new { param2 = "value2" }) %></li> 
     <li><%= Html.MySpecialActionLink("Content 3", "action3", new { param3 = "value3" }) %></li> 
    </ul> 
</div> 

Answer 2

El this HtmlHelper helper significa que es un "método de extensión" C# 3.0 en HtmlHelper, que es la forma en que esté disponible en el Html ejemplo, en su opinión (etc). Un método de extensión es un método estático que simula (en tiempo de compilación) como un método de instancia disponible en el tipo nominado por this (en este caso HtmlHelper). En realidad, el compilador llama al método estático (Html.Button({args})) como si hubiera escrito:

MyStaticClass.Button(Html, {args}); 

No es necesario utilizar el HtmlHelper que se pasa si no lo necesita (inded, me no lo use here); su trabajo principal (en este caso) es hacer que el código sea conveniente de consumir (como un método de extensión); pero puede ser útil en algunos casos.

Answer 3

No es necesario tener un HtmlHelper para crear enlaces que funcionen con las pestañas UQ jQuery AJAX.

jQuery plugin de pestañas acepta un argumento con nombre tabTemplate que se puede establecer:

$("#example").tabs({ tabTemplate: "<li><a href=\"#{href}\">#{label}</a></li>" }); 

Véase el documentation.