ASP.NET MVC Helper Extension Method not rendering text as a control

Question

Tried to create this Extension method. Works except that the helper is rendering text, not the control to the View when the page renders:

I included using System.Web.Mvc.Html; at the top of my helper class that contains this extension method so that it would understand helper.RadioButton.

public static string WriteTestControlToScreen(this HtmlHelper helper)
{
    StringBuilder fields = new StringBuilder();
    fields.Append("<fieldset>");
    fields.Append("     <div class='formLabel'><span class='requiredText'>*</span><label>Background Color</label></div>");
    fields.Append("     <div class='formField'>" + helper.RadioButton("rbBackgroundColorWhite", 0, false) + "<label class='fieldInlineLabel' for=''>White</label></div>");
    fields.Append("     <div class='formField'>" + helper.RadioButton("rbBackgroundColorWhite", 0) + "<label class='fieldInlineLabel' for=''>Black</label></div>");
    fields.Append("</fieldset>");

    return fields.ToString();
}

Output in the View then looks like this (notice it's not rendering a radiobutton but treating it as text instead):

*Background Color <%=Html.RadioButton('rbBackgroundColorWhite', 0, false)%>White <%=Html.RadioButton('rbBackgroundColorWhite', 0)%>Black

Answer 1

I did a little poking around with Reflector, and I noticed that the MVC extension methods for Input fields all use an InputHelper class, which in turn uses a TagBuilder class:

private static string InputHelper(this HtmlHelper htmlHelper, InputType inputType, string name, object value, bool useViewData, bool isChecked, bool setId, bool isExplicitValue, IDictionary<string, object> htmlAttributes)
{
 ModelState state;
 if (string.IsNullOrEmpty(name))
 {
  throw new ArgumentException(MvcResources.Common_NullOrEmpty, "name");
 }
 TagBuilder builder = new TagBuilder("input");
 builder.MergeAttributes<string, object>(htmlAttributes);
 builder.MergeAttribute("type", HtmlHelper.GetInputTypeString(inputType));
 builder.MergeAttribute("name", name, true);
 string str = Convert.ToString(value, CultureInfo.CurrentCulture);
 bool flag = false;
 switch (inputType)
 {
  case InputType.CheckBox:

              //...etc.

What follows are several case statements covering the additional rendering required for the various input types. But you get the point. The folks at MVC are not concatenating strings; they are using the MergeAttribute (and other) methods to do the dirty work for them. My guess is there is some browser compatibility goodness in there as well.

What I am suggesting is that you could use the TagBuilder class to build your HTML, just like the MVC folks do.

Answer 2

The problem with your original code is that you are outputting <%= %> tags at a time when MVC is expecting literal html output. In other words, it's not processing these tags.

Consider putting your HTML in an .ASCX file and doing a RenderPartial.