【问题标题】:Need Help building Custom Html Helper for Asp.net MVC需要帮助为 Asp.net MVC 构建自定义 Html Helper
【发布时间】:2023-03-13 08:55:02
【问题描述】:

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

所以要制作 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>

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

所以我想制作我自己的 html 帮助程序,其中包含一个带有 span 标签的 actionLink,并且可能在以后构建它以拥有一个无序的列出标签。

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

我正在使用允许我的自定义 html 助手在您执行“Html”时显示的方式。在智能意义上。

例如我会:

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

所以我不确定如何使用我传入的这个 HtmlHelper。

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

让我感到困惑的是在参数中使用关键字“this”。我不确定它指的是什么以及为什么需要它。我也不明白如何通过传递此参数但不使用它以某种方式允许您的客户 Html 助手被“Html.”访问。

谢谢

【问题讨论】:

    标签: c# asp.net-mvc


    【解决方案1】:

    this HtmlHelper helper 表示它是 HtmlHelper 上的 C# 3.0“扩展方法”,这就是它在您的视图(等)中的 Html 实例上可用的方式。扩展方法是一种静态方法,假装(在编译时)是this(在本例中为HtmlHelper)指定的类型上可用的实例方法。实际上,编译器调用静态方法 (Html.Button({args})) 就像您输入了:

    MyStaticClass.Button(Html, {args});
    

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

    【讨论】:

      【解决方案2】:

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

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

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

      请参阅documentation

      【讨论】:

      • 那么我只制作一个 div 列表并将“#”放在所有 herfs 的前面?我不确定代码应该是什么样子。我使用 HtmlHelpers 是因为我发现它们更干净并且停止了 spagetti 代码,这就是我使用它们的原因。我仍然想知道如何在自定义 Html 助手中调用制作的 Html 助手。
      • 来自链接的文档: tabTemplate:从中创建和添加新选项卡的 HTML 模板。占位符 #{href} 和 #{label} 被作为参数传递给 add 方法的 url 和 tab 标签替换。
      • @chobo2 - andymeadows 是对的。只需按照您喜欢的方式创建选项卡并使用 tabTemplate 选项让 jQuery 匹配您创建的链接(或任何其他元素)。
      • 对不起,我还是不关注。我需要一个完整的例子才能看到它。谢谢
      【解决方案3】:

      Marc's answer 非常棒。只需添加一些代码:

      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) 将 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) 享受:) :

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

      【讨论】:

      • 我会尽快尝试。所以我猜想使用 ActionLink 没有简单的方法,它有 10 个重载方法?我必须基本上拍照并选择我需要的东西?这还有什么作用? InnerHtml = (!String.IsNullOrEmpty(linkText)) ? HttpUtility.HtmlEncode(linkText) : String.Empty 你为什么要对它进行 HtmlEncoding 呢?我可以理解您为什么要检查空,但不确定为什么要对其进行编码。
      • linkText 必须是 HTML 编码,以产生正确的标记和安全原因。来自 MSDN:如果在 HTTP 流中传递空格和标点符号等字符,它们可能会在接收端被误解。 HTML 编码将 HTML 中不允许的字符转换为字符实体等价物;
      猜你喜欢
      • 2010-11-28
      • 1970-01-01
      • 2010-12-31
      • 1970-01-01
      • 2020-09-02
      • 1970-01-01
      • 1970-01-01
      • 2018-07-02
      • 1970-01-01
      相关资源
      最近更新 更多