需要帮助为Asp.net MVC构建Custom Html Helper

I been playing around with some custom html helpers and I now I am trying to make one that I can use for jquery AJAX UI Tabs.

我一直在玩一些自定义的html帮助器,我现在正在尝试制作一个可用于jquery AJAX UI选项卡的程序。

So to do ajax tabs you need to have this format in your html code

因此,要执行ajax选项卡,您需要在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>

so I can't use ActionLink because I don't think I can add anyway the tag to the actionLink.

所以我不能使用ActionLink,因为我认为无论如何我都不能将标签添加到actionLink。

So I want to make my own html helper that has an actionLink with a span tag in it and possibly build it up later on to have an unordered listed tag with it.

所以我想创建我自己的html帮助器,其中包含一个带有span标签的actionLink,并可能在以后构建它以获得带有无序列表标签。

So I am not sure how to use the ActionLink to my benefit. Like the ActionLink has 10 overloaded methods and I don't want to recreate all 10 of them since that just seems pointless. So is there away I can reference it or something like that?

所以我不确定如何使用ActionLink来获益。就像ActionLink有10个重载方法一样,我不想重新创建所有10个方法,因为这看起来毫无意义。那么我可以参考它或类似的东西吗?

I am using the way that allows my custom html helpers to show up when you do "Html." in intellisense.

当我使用“Html”时,我正在使用允许自定义html助手显示的方式。在intellisense。

for instance I would have:

比如我会:

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

So I am not sure how to make use of this HtmlHelper I am passing in.

所以我不知道如何利用我传入的这个HtmlHelper。

I also don't understand this part of the line of code "this HtmlHelper helper".

我也不明白这部分代码“this HtmlHelper helper”。

What confuses me is the using the keyword "this" in the parameter. I am not sure what it is refering to and why you need it. I also don't understand how by passing this parameter but not using it somehow allows your customer Html helpers to be accesed by "Html.".

令我困惑的是在参数中使用关键字“this”。我不确定它是指什么,为什么你需要它。我也不明白如何通过传递这个参数但不使用它以某种方式允许你的客户Html助手被“Html”加入。

Thanks

3 个解决方案

#1

Marc's answer is excellent. Just adding some code:

马克的答案非常好。只需添加一些代码:

1) Create static class with your helper:

1)使用助手创建静态类:

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) Add namespace of MyHtmlHelpers class to web.config:

2)将MyHtmlHelpers类的名称空间添加到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) Enjoy :) :

3)享受:):

<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>

#2

The this HtmlHelper helper means it is a C# 3.0 "extension method" on HtmlHelper, which is how it becomes available on the Html instance in your view (etc). An extension method is a static method that pretends (at compile time) to be an instance method available on the type nominated by this (in this case HtmlHelper). In reality, the compiler calls the static method (Html.Button({args})) as though you had typed:

这个HtmlHelper助手意味着它是HtmlHelper上的一个C#3.0“扩展方法”,它就是你在视图(等)中的Html实例上可用的方式。扩展方法是一种静态方法,它假装(在编译时)是由此指定的类型(在本例中为HtmlHelper)上可用的实例方法。实际上,编译器调用静态方法(Html.Button({args}))就好像你输入了:

MyStaticClass.Button(Html, {args});

It is not necessary to use the HtmlHelper that is passed in if you don't need it (inded, I don't use it here); it's main job (in this case) is to make the code convenient to consume (as an extension method); but it can be useful in some cases.

如果你不需要它,就没有必要使用传入的HtmlHelper(inded,我不在这里使用它);它的主要工作(在这种情况下)是使代码方便使用(作为扩展方法);但在某些情况下它可能很有用。

#3

You don't have to have a HtmlHelper to create links that work with jQuery AJAX UI Tabs.

您不必使用HtmlHelper来创建与jQuery AJAX UI选项卡一起使用的链接。

jQuery tabs plugin accepts an argument named tabTemplate that you can set :

jQuery选项卡插件接受一个名为tabTemplate的参数,您可以设置该参数:

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

See the documentation.

请参阅文档。

#1