Mvc3 jquery unobtrusive validation locale decimal field

asp.net-mvc-3unobtrusive-validation

I'm working on localized mvc3 web application using unobtrusive validation.
In web.config I've got :

<globalization culture="pl-PL" uiCulture="pl" />

Jquery 1.4.4 and jquery validation 1.6 is in use.

Problem is with decimal number separator character.

I can see that jquery validation is ignoring the culture and is expecting a dot character to always be the decimal separator. I need to use comma instead. I think it's the same in German language for example.

I created my own methods_pl.js file :

jQuery.extend(jQuery.validator.methods, {
number: function(value, element) {
    return this.optional(element) || /^-?(?:\d+|\d{1,3}(?:\.\d{3})+)(?:,\d+)?$/.test(value);
}
});

Above is solving the basic problem where decimal number is not recognized at all.

But when I try to use RangeAttribute on my model Decimal Price property it still doesn't work.
How to solve this?

Best Answer

If you set

key="UnobtrusiveJavaScriptEnabled" value="false"

the DecimalModelBinder posted in the previous answer will work, but you are disabling the clien-side validations.

To solve your problem you need to inlcude the correct jQuery locale. Look a this post from Scott Hanselmann or this post they should give you some help in implementing it.

You should add the Jquery.globalize plugin form NuGet then in your DOMready function add something like that to have number validated correctly (at least it works for me)

 $.validator.methods.number = function (value, element) {
        if (Globalize.parseFloat(value)) 
            return true;
        return false;
    }
 Globalize.culture('fr-FR');

then add the relative scripts in your page

<script src="@Url.Content("~/Scripts/jquery-1.7.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.globalize/globalize.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.globalize/cultures/globalize.culture.fr-FR.js")" type="text/javascript"></script>

Related Solutions

Asp.net-mvc – ASP.NET MVC 3 RC 2 client side validation with globalization

Unfortunately there's a naming conflict between jQuery.validate.format and jQuery.Globalization.format functions. Therefore you'll have to change your code to use the non-jquery Globalization plugin.

I just wrote a blog post about it here.

For you it should look like this:

<script src="@Url.Content("~/Scripts/globalization.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/globinfo/Globalization.de-DE.js")" type="text/javascript"></script>
<script type="text/javascript">
$.validator.methods.number = function (value, element) {
    if (!isNaN(Globalization.parseFloat(value))) {
        return true;
    }
    return false;
}
$(document).ready(function () {
    $.culture = jQuery.cultures['de-DE'];
    $.preferCulture($.culture.name);
    Globalization.preferCulture($.culture.name);
});
</script>

That should be enough.

C# – Unobtrusive DateTime? Validation in MVC4

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

Best Answer

Related Solutions

Asp.net-mvc – ASP.NET MVC 3 RC 2 client side validation with globalization

C# – Unobtrusive DateTime? Validation in MVC4

Related Topic