Globalize error with local numbers on .Net MVC Pro

问题:

I am trying to validate local decimal numbers (Portuguese -> pt-PT) but I get a console error in the Browser:

Uncaught TypeError: t.parseFloat is not a function.  Exception occurred when checking element SizeOpenedWidth, check the 'number' method.

In Portugal, the decimal separator is the ",", so a valid decimal number here is "10,21".

The script I use to load Globalization:

$.when(
        $.getJSON("/Scripts/cldr/supplemental/likelySubtags.json"),
        $.getJSON("/Scripts/cldr/main/numbers.json"),
        $.getJSON("/Scripts/cldr/main/ca-gregorian.json"),
        $.getJSON("/Scripts/cldr/supplemental/timeData.json")
    ).then(function () {

        // Normalize $.get results, we only need the JSON, not the request statuses.
        return [].slice.apply( arguments, [ 0 ] ).map(function( result ) {
            return result[ 0 ];
        });

    }).then( Globalize.load ).then(function() {

        Globalize.locale("pt-PT");
    });

On the View I use unobtrusive validation:

<div class="form-group">
    @Html.LabelFor(model => model.SizeOpenedWidth, htmlAttributes: new { @class = "control-label col-md-3" })
    <div class="col-md-3">
        <div class="input-group">
            @Html.EditorFor(model => model.SizeOpenedWidth, new { htmlAttributes = new { @class = "form-control" } })
            @Html.ValidationMessageFor(model => model.SizeOpenedWidth, "", new { @class = "text-danger" })
        </div>
    </div>
</div>

To load all the libraries, I use the Shared/Layout file:

<script src="/Scripts/jquery/jquery-2.1.4.js"></script>

<script src="/Scripts/cldr.js"></script>
<script src="/Scripts/cldr/event.js"></script>
<script src="/Scripts/cldr/supplemental.js"></script>
<script src="/Scripts/cldr/unresolved.js"></script>
<script src="/Scripts/globalize.js"></script>
<script src="/Scripts/globalize/number.js"></script>
<script src="/Scripts/globalize/date.js"></script>

<script src="/Scripts/moment.min.js"></script>
<script src="/Scripts/moment-with-locales.min.js"></script>

<script src="/Scripts/bootstrap/bootstrap.js"></script>
<script src="/Scripts/respond/respond.js"></script>

<script src="/Scripts/jquery/jquery.validate.min.js"></script>
<script src="/Scripts/jquery/jquery.validate.globalize.min.js"></script>
<script src="/Scripts/jquery/jquery.validate.unobtrusive.min.js"></script>

<script src="/Scripts/bootstrap-datetimepicker.js"></script>

回答1:

The problem was related with the jQuery Validation Globalize Library version.

I was using the version 1.0.1 that was still using the parseFloat method.

This method is not available anymore with Globalize v1.0.0, it has been replaced with the method Globalize.parseNumber.

After updating to version 1.1.0, everything started to work properly.