MVC Jquery globalization - validating a decimal

I am struggling to validate a decimal field using globalization.

I need my value to be in french format (with coma as decimal separator and no thousand separator).

EDIT : updated following This great solution

So, here is my model :

public class CompanyTaxHistoryModel
{
    [Required]
    public DateTime DateFrom { get; set; }

    [Required]
    public DateTime DateTo { get; set; }

    [Required]
    [Range(0, 100, ErrorMessage = "The percentage must be between 0 and 100")]
    [DisplayFormat(DataFormatString = "{0:N} %")]
    [Display(Name = "Company Tax")]
    public decimal CompanyTaxPercent { get; set; }

}

here is my web.config :

<globalization requestEncoding="UTF-8" responseEncoding="UTF-8" culture="auto" uiCulture="auto" />

I have added a "localizationHelper" as follows :

namespace xxxx.Helpers
{
    public static class LocalizationHelpers
    {
        public static IHtmlString MetaAcceptLanguage<t>(this HtmlHelper<t> html)
        {
            var acceptLanguage = HttpUtility.HtmlAttributeEncode(System.Threading.Thread.CurrentThread.CurrentUICulture.ToString());
            return new HtmlString(String.Format("<meta name=\"accept-language\" content=\" {0}\">",acceptLanguage));

        }
    }
}

Wich i use in my _Layout.cshtml :

@using xxxx.Helpers
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    @Html.MetaAcceptLanguage()

I have added the Globalize.js + the needed cultures to my project and added the below to my scripts :

$(document).ready(function () {
    var data = $("meta[name='accept-language']").attr("content")
    Globalize.culture(data);
});

$.validator.methods.date = function (value, element) {
    return Globalize.parseDate(value);
};

$.validator.methods.range = function (value, element, param) {
    return this.optional(element) || (Globalize.parseFloat(value) >= param[0] && Globalize.parseFloat(value) <= param[1]);
}

$.validator.methods.number = function (value, element) {
    return !isNaN(Globalize.parseFloat(value));
}

Everything seems to be working just fine but I have a problem with the decimal values as the "." button of any keyboard should render the appropriated value (either a "." or a "," according to the local culture).

For example, my browser is set to fr-FR and if I type "12,5" using the numeric pad only, I get "12.5" and therefore I get a validation error.

In such case the "." button of the numeric pad shall be understood as a coma.

any ideas, what am I missing ?

Solution

So,

for the globalization issue, the solution was here and reflected in the edit of my question (so far seems to work perfectly).

as for the point/comma issue here is what i did

function validateFrNumber(e) {

        theCulture = Globalize.cultureSelector;
        foundFR = theCulture.indexOf("FR")
        foundfr = theCulture.indexOf("fr")

        if (foundFR != '-1' || foundfr != '-1') {
            theValeur = $(e).find("input").val();
            foundDot = theValeur.indexOf(".");

            if (foundDot > -1) {
                $(e).find("input").attr('value', theValeur.replace(".", ","));
            }
        }

}

and then call this in the input onkeyup:

<div class="input" onkeyup="validateFrNumber(this)">@Html.EditorFor(model => model.MydecimalValue)</div>