Tech Blog
Since 2004
jQuery / MVC and TextArea Length Validation
Surprised about a jQuery issue.
- May 29, 2017
Rest of the Story:
I came across this issue today, and actually surprised I have not had to resolve this problem earlier.
When validating a textarea on the client side with jQuery unobtrusive validation (for length) you have to be conscientious about how JavaScript deals with carriage return/line feed characters in comparison to the posted values to your controller. For example on the client JavaScript sees CR/LF as \n while after posted to the server that same CR/LF will be represented by \r\n. If you are validating the user entered data for length your counts will be different depending on the environment (i.e. model will pass validation on the client but fail on the server).
The resolution was to fix the data server side.
This was done with a customization/extension to the DefaultModelBinder, so that all controller actions will benefit immediately.
You will notice that I trimmed the original input and then replaced \r\n with \n.
protected override void BindProperty(ControllerContext controllerContext, ModelBindingContext bindingContext, PropertyDescriptor propertyDescriptor)
{
base.BindProperty(controllerContext, bindingContext, propertyDescriptor);
// Note: if desired, one could restrict the conversion to properties decorated with [StringLength]:
// && propertyDescriptor.Attributes.OfType().Any()
if (propertyDescriptor.PropertyType == typeof(string))
{
var originalString = propertyDescriptor.GetValue(bindingContext.Model) as string;
if (!string.IsNullOrEmpty(originalString))
{
originalString = originalString.Trim();
var stringWithNormalizedNewlines = originalString.Replace("\r\n", "\n");
propertyDescriptor.SetValue(bindingContext.Model, stringWithNormalizedNewlines);
}
}
}