Unobtrusive DateTime? Validation in MVC4

Question

I upgraded an MVC3 solution to MVC4. After the migration, the validator is broken.

My input date, if i select German as language, is \"20.03.2013\". I get an validation

Answer 1

Try overwriting the default date validator:

// Replace dots so jq validator can understand what's going on
$(function () {
    $.validator.addMethod(
    "date",
    function (value, element) {
        var s = value;
        s = value.replace(/\./g, '/');

        // Chrome requires tolocaledatestring conversion, otherwise just use the slashed format
        var d = new Date();
        return this.optional(element) || !/Invalid|NaN/.test(new Date(d.toLocaleDateString(value))) || !/Invalid|NaN/.test(new Date(s));
    },
    ""
    );
});

$.validator.unobtrusive.parse();

Answer 2

Looking through the code with ILSpy it appears to be the newly introduced ClientDataTypeModelValidatorProvider that is adding the data-val-date attribute.

If you want to revert to MVC3 style functionality then simply removing that provider from the list of model validation providers does the trick.

It doesn't solve the problem but in a few lines of code may remove the problems caused by jquery validation's lack of globalization.

using System.Web.Mvc;

...

protected void Application_Start()
{
  var providers = ModelValidatorProviders.Providers;
  var clientDataTypeModelValidatorProvider = providers.OfType<ClientDataTypeModelValidatorProvider>().FirstOrDefault();
  if ( clientDataTypeModelValidatorProvider != null )
  {
    providers.Remove( clientDataTypeModelValidatorProvider );
  }

  ...
}

Answer 3

If this only occurs in Chrome then it is due to the jquery version having a culture bug in the validation of dates.

Answer 4

The point is that Mvc3 doesnt validate at all dates on the client side that is the point. You just set the cultrure on the server side....but your culture settings are not reflected at all on the client side...at least the Mvc engine doesnt do it automatically. The only way to handle properly dates and numbers on the client side with cultures that differs from English is to use a a javascript globalization library that is able to parse properly dates in all cultures, and to set the client side culture equal to the server side culture, then you have to redefine properly all validation methods to use globalized functions. Please read this post of my blog that clarifies how to handle properly globalization on the client side: http://www.dotnet-programming.com/post/2011/12/14/Globalization-Validation-and-DateNumber-Formats-in-AspNet-MVC.aspx

Moreover, please dont confuse CurrentCulture with CurrentUICulture CurrentUICulture doesnt affect at all the way numbers or dates are handled, but only the resource files containing culture specifi resources such as localized strings.

Finally, it is very unefficient to set the culture in the model binder, since the model binder is a recursive function so it si called hundreds of times during model reconstruction, and the culture setting operation is not a simple variable setting operation but it has a not negligible cost. It is better to write a global controller filter to handle culture setting (I always do this way) so the operation is performed just once per request

Answer 5

Microsoft suggests to replace the new jquery.validate.js from mvc4 with the old jquery.validate.js from the MVC3 project template. This works, but the funny thing is, the bug is not in MVC4, it was in MVC3.

We use the way which was described by Francesco, see the accepted answer.