MVC 4 TextBoxFor and others automatically call HttpUtility.HtmlAttributeEncode

Question

Problem

I am trying to implement an HTML5 / jQuery layout in MVC and am facing a problem that I have never encountered; it appears using Html.TextBoxFor, Html.PasswordFor and others that automatically encode passed HTML attributes.

Example

Take the following line, for example:

@Html.TextBoxFor(m => m.Pin, new { data_regexp="<\\d{4}>" }) 

This code will be used to verify the PIN code on the credit card, and I need to use the regexp data template to pass the corresponding regular expression. I expect the result to be as follows:

 <input data-regexp="<\d{4}>" id="Pin" type="text" /> 

Instead, it apparently calls the HtmlAttributeEncode ( http://msdn.microsoft.com/en-us/library/wdek0zbf.aspx ) from the built-in extension, which results in the following encoded :

 <input data-regexp="&lt;\d{4}>" id="Pin" type="text" /> 

Desired Solution Note

Do I have another option than writing my own extensions? Using other forms of validation is not an option, and this example - just to show the problem - I have a few other examples where I need raw HTML code and not an encoded version.

Edit: Using Html.Raw or HttpUtility.Decode is not affected. Coding occurs after applying any of them.

Answer 1

Figured it out. I added the following class:

 namespace MyProjectName.Extensions { public class HtmlAttributeNoEncoding : HttpEncoder { protected override void HtmlAttributeEncode(string value, TextWriter output) { output.Write(value); } } } 

And changed my web configuration:

 <system.web> ... <httpRuntime targetFramework="4.5" encoderType="MyProjectName.Extensions.HtmlAttributeNoEncoding"/> ... </system.web> 

Answer 2

Try this native HTMLHelper extension:

Custom HtmlHelper Extensions:

 using System; using System.ComponentModel; using System.Linq.Expressions; using System.Web; using System.Web.Mvc; using System.Web.Mvc.Html; namespace MvcApplication.Extensions { public static class HtmlHelperExtensions { public static IHtmlString MyTextBoxFor<TModel, TProperty>(this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, TProperty>> expression, object htmlAttributes, object dataAttribute) { MvcHtmlString textBoxFor = InputExtensions.TextBoxFor<TModel, TProperty>(htmlHelper, expression, htmlAttributes); string stringDataAttributes = string.Empty; foreach (PropertyDescriptor property in TypeDescriptor.GetProperties(dataAttribute)) { stringDataAttributes+= string.Format("data-{0}=\"{1}\" ", property.Name, property.GetValue(dataAttribute)); } string textBoxForText = textBoxFor.ToHtmlString(); string textBoxWithData = textBoxForText.Insert(textBoxForText.IndexOf("/>"), stringDataAttributes); return htmlHelper.Raw(textBoxWithData); } } } 

cshtml:

 @Html.MyTextBoxFor(m => m.Pin, null, new { regexp = "<\\d{5}>" }) 

Result:

 <input id="Pin" name="Pin" type="text" value="" data-regexp="<\d{5}>" /> 

Answer 3

It will work if you use data annotation on the model.

 [RegularExpression(@"\d{4}", ErrorMessage="4 digit PIN required")] public string Pin { get; set; } 

Then you can use TextboxFor without additional attributes:

 @Html.TextBoxFor(m => m.Pin) 

This returns html as:

 data-val-regex="4 digit PIN required" data-val-regex-pattern="\d{4}"