asp.net mvc with jquery validation and Html.EditorFor and different decimalseparators

Question

I've read a lot of blogposts about this subject, but I never saw the complete solution.

I've scaffolfed this default html (where bedrag is a Decimal):

<div class="editor-field">
            @Html.EditorFor(model => model.Bedrag)
            @Html.ValidationMessageFor(model => model.Bedrag)
        </div>

This generates a comma for the decimal in the input control when the page is rendered, even when I put this in my web.config: <globalization culture="en-US" uiCulture="en-US" /> or this one <globalization culture="auto" uiCulture="auto" />

Then, the Jquery Validation plugin complains that I have a comma as decimal separator in my 'bedrag' input field (which has been put there by the @Html.EditorFor(model => model.Bedrag)), which gives the error my input is not a number; it expects a dot as a decimal separator.

But, when I enter the number as this 12.90, the defaults modelbinder converts my input to 1290 (input times 100).

Then I created a custom modelbinder, and in that code, the currentculture is 'nl-NL', so not the 'en-US' from my web.config.

So now I'm wondering:

1 Do I still need a custom model binder in 2014?

2 Which culture is used when ASP.Net creates the value for @Html.ValidationMessageFor(model => model.Bedrag)? (and why not the one from my web.config?)

3 How can I dynamicly set the culture to use for the @Html.ValidationMessageFor(model => model.Bedrag)

4 How can I dynamicly set the culture to use for the Jquery validation?

I've been out of ASP.Net MVC for a year, but can it be that in 2014 I still have these issues with decimal signs?

yes I did, but it has a link to 'jQuery Global plugin.' which is 404, and to this page '700 jQuery Globs from GitHub.' which is also 404. — Michel
– Michel, Commented Mar 11, 2014 at 21:53

Thijs · Accepted Answer · 2015-02-27 09:03:53Z

The approach I used is to extend the jQuery validator. It is based on this blogpost. I setted the culture in the metadata to BE-nl. Since this is a pure Dutch website, I don't do any checks further on.

$(function () {
    // Look in metatag what culture we want
    // and set this as culture for the client side.
    var data = $("meta[name='accept-language']").attr("content");
    Globalize.culture(data.toString());

    // Don't validate on keyup event because it will mess up
    // the cursor when replacing values in a textbox.
    $('form').each(function () {
        var validator = $(this).data('validator');
        if (validator) {
            validator.settings.onkeyup = false;
        }
    });

    // Belgianize/sanitize the numbers inserted
    // 1 000 000    =>      1000000
    // 1.00         =>      1,00
    $.validator.methods.number = function (value, element) {
        var s = value.replace(/\ /g, '').split('.').join(',');

        if (s.split(',').length < 3) {
            var number = Globalize.parseFloat(s);
            if (!isNaN(number)) {
                $(element).val(s);
                return this.optional(element) || true;
            }
        }

        return this.optional(element) || false;
    };
});

I think I used this jQuery library for the globalization

Amirhossein Mehrvarzi · Accepted Answer · 2014-03-12 03:27:45Z

0

I think using jQuery Globalization Plugin from Microsoft will solve your problem.

answered Mar 12, 2014 at 3:27

Amirhossein Mehrvarzi

19.1k7 gold badges52 silver badges74 bronze badges

Collectives™ on Stack Overflow

asp.net mvc with jquery validation and Html.EditorFor and different decimalseparators

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related