MVC 3 htmlhelper extension method to wrap around content

Question

MVC 3 htmlhelper extension method to wrap around content

12.2k Views Asked by Sanj At 13 April 2025 at 08:55

I searched but could not find any quick solutions for an MVC 3 htmlhelper to create a wrapper method. What I'm looking for is something like:

@html.createLink("caption", "url")
{
    <html> content in tags </html>
}

the result should have

<a href="url" title="Caption">
  <html> content in tags </html>
</a>

Any help with this.

Original Q&A

There are 3 best solutions below

Richard Forrest On 17 May 2012 at 11:59

At its simplest level something like this would do it

public static MvcHtmlString SomeLink(this HtmlHelper htmlHelper, string href, string     title,  string content )
    {
        var urlHelper = ((Controller)htmlHelper.ViewContext.Controller).Url;
        //var url = urlHelper.Action(actionName, controllerName, routeValues);

        var someLink = new TagBuilder("a");
        someLink.MergeAttribute("href", href);
        someLink.InnerHtml = content;

        return new MvcHtmlString(someLink.ToString());
    }

slawek On 10 December 2012 at 13:43

There's also another way, without disposable trick. It's less work, great for small helpers. I answered similar question, and don't want to copy everything, but here's a short example:

@helper Paragraph(string cssClass, Func<object, object> markup) {
    <p class="@cssClass">@markup.DynamicInvoke(this.ViewContext)</p>
}

Usage of this helper looks like this:

@Paragraph("highlited", 
    @<text>
        Look, a @Html.ActionLink("link", "index")
    </text>
)

My full answer to the other similar question here.

**Jamie Dixon** · Accepted Answer

The way that this is done with BeginForm is that the return type MvcForm impliments IDisposable so that when used within a using statement, the Dispose method of MvcForm writes out the closing </form> tag.

You can write an extension method that does exactly the same thing.

Here's one I just wrote to demonstrate.

First off, the extension method:

public static class ExtensionTest
{
    public static MvcAnchor BeginLink(this HtmlHelper htmlHelper)
    {
        var tagBuilder = new TagBuilder("a");
        htmlHelper.ViewContext.Writer
                        .Write(tagBuilder.ToString(
                                             TagRenderMode.StartTag));
        return new MvcAnchor(htmlHelper.ViewContext);
    }
}

And here's our new type, MvcAnchor:

public class MvcAnchor : IDisposable
{
    private readonly TextWriter _writer;
    public MvcAnchor(ViewContext viewContext)
    {
        _writer = viewContext.Writer;
    }

    public void Dispose()
    {
        this._writer.Write("</a>");
    }
}

In your views you can now do:

@{
    using (Html.BeginLink())
    { 
        @Html.Raw("Hello World")
    }
}

Which yields the result:

<a>Hello World</a>

Expanding this slightly to deal with your exact requirement:

public static MvcAnchor BeginLink(this HtmlHelper htmlHelper, 
                                   string href, 
                                   string title)
{
    var tagBuilder = new TagBuilder("a");
    tagBuilder.Attributes.Add("href",href);
    tagBuilder.Attributes.Add("title", title);
    htmlHelper.ViewContext.Writer.Write(tagBuilder
                                    .ToString(TagRenderMode.StartTag));
    return new MvcAnchor(htmlHelper.ViewContext);
}

and our view:

@{
  using (Html.BeginLink("http://stackoverflow.com", "The Worlds Best Q&A site"))
  { 
      @Html.Raw("StackOverflow - Because we really do care")
  }
}

which yields the result:

<a href="http://stackoverflow.com" title="The Worlds Best Q&amp;A site">
   StackOverflow - Because we really do care</a>

MVC 3 htmlhelper extension method to wrap around content

There are 3 best solutions below

Related Questions in ASP.NET

Related Questions in ASP.NET-MVC-3

Related Questions in RAZOR

Related Questions in HTMLEXTENSIONS

Trending Questions

Popular # Hahtags

Popular Questions