Question

We’ve recently added an extension method (string.Highlight(string target)) to wrap occurences of the target text with <span class="highlighted"></span>, and are using it for all text displayed on the page.

The initial issue we ran into was that rather than the text being wrapped in the tag, the text was wrapped in plaintext "<span clas...". We’ve managed to resolve this with the exception of text within a link.

<%= Html.ActionLink(linkText.Highlight(word), action) %>

This sticks the text "<span class..." into the link, which is not what we want. Is there a way to apply our highlighting class to some of the text within the link, or should we forget about it?

---

The extension method:

public static string Highlight(this string text, this string target)
{
    return text.Replace(target, @"<span class=""highlighted"">" + target + "</span>";
}

Answer 1

You could write a custom ActionLink extension method that doesn’t HTML encode the text as the standard helper does:

public static MvcHtmlString UnencodedActionLink(
    this HtmlHelper htmlHelper,
    string linkText,
    string actionName
)
{
    var str = UrlHelper.GenerateUrl(null, actionName, null, null, null, null, new RouteValueDictionary(), htmlHelper.RouteCollection, htmlHelper.ViewContext.RequestContext, true);
    var a = new TagBuilder("a")
    {
        InnerHtml = !string.IsNullOrEmpty(linkText) ? linkText : string.Empty
    };
    a.MergeAttribute("href", str);
    return MvcHtmlString.Create(a.ToString(TagRenderMode.Normal));
}

and then:

<%= Html.UnencodedActionLink(linkText.Highlight(word), action) %>

or even better:

public static MvcHtmlString HighlightedActionLink(
    this HtmlHelper htmlHelper,
    string linkText,
    string word,
    string actionName
)
{
    var str = UrlHelper.GenerateUrl(null, actionName, null, null, null, null, new RouteValueDictionary(), htmlHelper.RouteCollection, htmlHelper.ViewContext.RequestContext, true);
    var a = new TagBuilder("a")
    {
        InnerHtml = !string.IsNullOrEmpty(linkText) ? linkText.Highlight(word) : string.Empty
    };
    a.MergeAttribute("href", str);
    return MvcHtmlString.Create(a.ToString(TagRenderMode.Normal));
}

and then:

<%= Html.HighlightedActionLink(linkText, word, action) %>