Client-side validation difference between Html.TextBoxFor/Html.TextAreaFor and Html.EditorFor (with [DataType(DataType.MultilineText)])

Johan Olsson picture Johan Olsson · Jun 21, 2011 · Viewed 7.6k times · Source

I am using client-side validation (unobtrusive) in ASP.NET MVC 3/Razor and I got it to work on a <textarea> by using Html.EditorFor and specifying DataType.MultilineText, but should not Html.TextAreaFor also have client-side validation?

[Required(ErrorMessage = "Foo")]
public string Message { get; set; }

// Does add client-side validation
@Html.TextBoxFor(m => m.Message)

// Does NOT add client-side validation
@Html.TextAreaFor(m => m.Message)

[Required(ErrorMessage = "Foo")]
[DataType(DataType.MultilineText)]
public string Message { get; set; }

// Does add client-side validation (and multiline)
@Html.EditorFor(m => m.Message)

// Does NOT add client-side validation
@Html.TextAreaFor(m => m.Message)

<add key="ClientValidationEnabled" value="true" />
<add key="UnobtrusiveJavaScriptEnabled" value="true" />

Answer

obliojoe picture obliojoe · Jul 10, 2011

Your example above works fine for me. I wonder - was this a precise example, or was it simplified from a real world problem? I have found this exact behavior when using a model with nested properties.

So, for example, if I change your model to look like this:

public class MyModelObject
{
    [Required(ErrorMessage = "Foo")]
    [DataType(DataType.MultilineText)]
    public string Message { get; set; }
}

public class MyModel
{
    public MyModelObject MyObject { get; set; }
}

Then I reproduce the exact problem you mentioned.

@Html.EditorFor(x => x.MyObject.Message)

generates the jquery validation attributes as expected:

<textarea class="text-box multi-line input-validation-error" data-val="true" data-val-required="Foo" id="MyObject_Message" name="MyObject.Message"></textarea>

But, this:

@Html.TextAreaFor(x => x.MyObject.Message)

Does not:

<textarea cols="20" id="MyObject_Message" name="MyObject.Message" rows="2"></textarea>

If this does in fact describe your issue, it looks like this has been reported as a bug: http://aspnet.codeplex.com/workitem/8576