Custom HtmlHelper Renders Text and not Markup

Question

I have written a basic HtmlHelper. Here's a test I wrote that simplifies what I was doing and to provide self assurance that it is happening when I use StringBuilder and TagBuilder objects:

public static string HelloWorld(this HtmlHelper htmlHelper, string name)
{
    var sb = new StringBuilder();
    var builder = new TagBuilder("span");
    builder.InnerHtml = "Hello, " + name + "!";
    sb.Append(builder.ToString(TagRenderMode.Normal));
    sb.Append("<br/>");

    return sb.ToString();
}

The output for this control encodes the string so I see the following: <span>Hello, Jason!</span><br/>

In my view, I'm using the following: @Html.HelloWorld("Jason")

Any ideas what I can be doing wrong?

Answer 1

The Razor engine escapes HTML by default in any strings that it renders. If you change the return type to IHtmlString, this won't happen.

public static IHtmlString HelloWorld(this HtmlHelper htmlHelper, string name)
    ...
    return new HtmlString(sb.ToString());
}

Answer 2

Your static method must be HtmlString instead of string, and you must return the HtmlString(sb.ToString());

public static HtmlString HelloWorld(this HtmlHelper htmlHelper, string name)
{
    var sb = new StringBuilder();
    var builder = new TagBuilder("span");
    builder.InnerHtml = "Hello, " + name + "!";
    sb.Append(builder.ToString(TagRenderMode.Normal));
    sb.Append("<br/>");

    return new HtmlString(sb.ToString());
}