ASP.NET MVC3 HtmlHelper extension method like BeginForm that uses a partial view?

Question

I created an extension method based on this answer to the SO question c# - How can I create a Html Helper like Html.BeginForm - Stack Overflow and it works fine.

Can I move the embedded HTML in the extension method into a partial view and use that partial view in the method while preserving it's current behavior? In particular, I want to be able to 'wrap' a block of arbitrary HTML.

I ask not out of any pressing need, but simply out of a desire to maintain HTML consistently, e.g. as views and partial views. I imagine it will be a lot easier to spot any problems with the HTML if it's in a view or partial view too.

Here's the HtmlHelper extension method:

public static IDisposable HelpTextMessage(this HtmlHelper helper, bool isHidden, string heading)
{
    TextWriter writer = helper.ViewContext.Writer;

    writer.WriteLine(
        String.Format(
            "<div class=\"help-text {0}\">",
            isHidden ? "help-text-hidden" : ""));

    writer.WriteLine(
        String.Format(
            "<div class=\"help-text-heading\">{0}</div>",
            heading));

    writer.Write("<div class=\"help-text-body\">");

    return new HelpTextMessageContainer(writer);
}

Here's the HelpTextMessageContainer class:

private class HelpTextMessageContainer : IDisposable
{
    private readonly TextWriter _writer;

    public HelpTextMessageContainer(TextWriter writer)
    {
        _writer = writer;
    }

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

In a view, I can use the extension method like this:

@using(Html.HelpTextMessage(Model.HelpText.IsHelpTextHidden(Model.SomeHelpMessage), "Something"))
{
    @:To do something, first do something-more-specific, then do another-something-more-specific.
}

Or I could use it like this too:

@using(Html.HelpTextMessage(Model.HelpText.IsHelpTextHidden(Model.SomeHelpMessage), "Something"))
{
    <p>To do something, first do something-more-specific, then do another-something-more-specific.</p>
    <p>Also, keep in mind that you might need to do something-else-entirely if blah-blah-blah.</p>
}

score 1 · Answer 1 · answered Feb 21 '14 at 17:40

I haven't found any way to move the "embedded HTML" into a partial view exactly, but a slightly more-friendly way to encapsulate the HTML in a way that provides HTML and Razor syntax highlighting and Intellisense is to move into a view helper function in a file under the app App_Code folder as described in this post on "Hugo Bonacci's Blog".

Here's my helper function:

@helper HelpTextMessage(bool isHidden, string heading, Func<object, object> content)
{
    <div class="help-text @(isHidden ? "help-text-hidden" : "")">
        <div class="help-text-heading">
            @heading
        </div>
        <div class="help-text-body">
            @content(null)
        </div>
    </div>
}

Assuming the above helper function is in a file named ViewHelpers.cshtml in the App_Code folder, it can be called in a view like this:

@ViewHelpers.HelpTextMessage(false, "Something",
    @:To do something, first do something-more-specific, then do another-something-more-specific.
)

or this:

@ViewHelpers.HelpTextMessage(false, "Something",
    <p>To do something, first do something-more-specific, then do another-something-more-specific.</p>
    <p>Also, keep in mind that you might need to do something-else-entirely if blah-blah-blah.</p>
)

I like having the embedded HTML in a view more than I do being able to use the @using(Html.HelpTextMessage(...){ ... } syntax, so I'm pretty happy with this as a solution.

ASP.NET MVC3 HtmlHelper extension method like BeginForm that uses a partial view?

1 Answers1

Linked