глобализировать проблему проверки с контролем ввода даты и времени - PullRequest
0 голосов
/ 28 февраля 2019

Я пытаюсь использовать функциональность cldr-data и globalize для проверки моих входных данных в веб-проекте ASP.NET Core MVC.

Проблема возникает из-за того, что кажется, что она может загрузить правильные файлы cldr-data на основе свойства navigator.language (я знаю, что это не всегда точно, но это должно быть допустимо в этом сценарии. Моя ОС установлена ​​на en-US, браузер имеет три языка с "de" в качестве дисплея и первым в списке для navigator.languages)

Хотя разделитель запятых распознается правильно (он принимает , и отказывается . для ввода датыЯ не могу понять, почему даты помечены как недействительные.

Дата отображается в правильном формате de dd.mm.yyyy enter image description here

Создать формутакже отображает поле ввода в правильном формате enter image description here

Использование . в качестве разделителя запятых вызывает недопустимое значение enter image description here

Использованиеселектор datetimepicker дает мне неверную дату

Opera / Chrome

enter image description here enter image description here

Край

enter image description here enter image description here

Firefox

enter image description here enter image description here

Настройки enter image description here

_ValidationScriptsPartial.cshtml

<environment include="Development">
    <script src="~/lib/jquery-validation/dist/jquery.validate.js"></script>
    <script src="~/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.js"></script>

    <!-- cldr scripts (needed for globalize) -->
    <script src="~/lib/cldrjs/dist/cldr.js"></script>
    <script src="~/lib/cldrjs/dist/cldr/event.js"></script>
    <script src="~/lib/cldrjs/dist/cldr/supplemental.js"></script>
    <!-- globalize scripts -->
    <script src="~/lib/globalize/dist/globalize.js"></script>
    <script src="~/lib/globalize/dist/globalize/number.js"></script>
    <script src="~/lib/globalize/dist/globalize/date.js"></script>

    <script src="~/lib/jquery-validation-globalize/jquery.validate.globalize.js"></script>

</environment>
<environment exclude="Development">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.17.0/jquery.validate.min.js"
            asp-fallback-src="~/lib/jquery-validation/dist/jquery.validate.min.js"
            asp-fallback-test="window.jQuery && window.jQuery.validator"
            crossorigin="anonymous"
            integrity="sha256-F6h55Qw6sweK+t7SiOJX+2bpSAa3b/fnlrVCJvmEj1A=">
    </script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validation-unobtrusive/3.2.11/jquery.validate.unobtrusive.min.js"
            asp-fallback-src="~/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.min.js"
            asp-fallback-test="window.jQuery && window.jQuery.validator && window.jQuery.validator.unobtrusive"
            crossorigin="anonymous"
            integrity="sha256-9GycpJnliUjJDVDqP0UEu/bsm9U+3dnQUH8+3W10vkY=">
    </script>
</environment>

<script type="text/javascript">
    function setGlobalization() {
        debugger;
        var url = "@Url.Action("GetBrowserLanguage", "Movies")";
        $.ajax({
            cache: false,
            type: 'GET',
            url: url,
            data: { navigatorlanguage: navigator.language }
        }).done(function (result) {
            debugger;
            $.when(
                $.get("/lib/cldr-data/supplemental/likelySubtags.json"),
                $.get("/lib/cldr-data/main/" + result.language + "/numbers.json"),
                $.get("/lib/cldr-data/supplemental/numberingSystems.json"),
                $.get("/lib/cldr-data/main/" + result.language + "/ca-gregorian.json"),
                $.get("/lib/cldr-data/main/" + result.language + "/timeZoneNames.json"),
                $.get("/lib/cldr-data/supplemental/timeData.json"),
                $.get("/lib/cldr-data/supplemental/weekData.json")
            ).then(function () {
                debugger;
                // 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 () {
                debugger;
                Globalize.locale(result.language);
            });
        }).fail(function (result) {
            alert("Server error(setGlobalization): " + result.statusText + " Please refresh and try again");
        });
    }
    document.addEventListener('DOMContentLoaded', function () {
        setGlobalization();
    }, false);

</script>

Create.cshtml

    <form asp-action="Create">
        <div asp-validation-summary="ModelOnly" class="text-danger"></div>
        <div class="form-group">
            <label asp-for="Title" class="control-label"></label>
            <input asp-for="Title" class="form-control" />
            <span asp-validation-for="Title" class="text-danger"></span>
        </div>
        <div class="form-group">
            <label asp-for="ReleaseData" class="control-label"></label>
            <input asp-for="ReleaseData" class="form-control" />
            <span asp-validation-for="ReleaseData" class="text-danger"></span>
        </div>
        <div class="form-group">
            <label asp-for="Genre" class="control-label"></label>
            <input asp-for="Genre" class="form-control" />
            <span asp-validation-for="Genre" class="text-danger"></span>
        </div>
        <div class="form-group">
            <label asp-for="Price" class="control-label"></label>
            <input asp-for="Price" class="form-control" />
            <span asp-validation-for="Price" class="text-danger"></span>
        </div>
        <div class="form-group">
            <input type="submit" value="Create" class="btn btn-primary" />
        </div>
    </form>

MoviesController.cs

public ActionResult GetBrowserLanguage(string navigatorlanguage)
{
    try
    {
        string localePattern = "lib\\cldr-data\\main\\{0}";
        var cultureToUse = "es-ES"; //Default regionalisation to use
        string defaultLanguage = "es";

        if (navigatorlanguage.StartsWith("es", StringComparison.InvariantCultureIgnoreCase))
            cultureToUse = "es";
        if (navigatorlanguage.StartsWith("de", StringComparison.InvariantCultureIgnoreCase))
            cultureToUse = "de";
        if (navigatorlanguage.StartsWith("en", StringComparison.InvariantCultureIgnoreCase))
            cultureToUse = "en-US-POSIX";

        if (!System.IO.Directory.Exists(System.IO.Path.Combine(_hostingEnvironment.WebRootPath, string.Format(localePattern, cultureToUse))))
            cultureToUse = defaultLanguage;

        return Json(new
        {
            error = false,
            exception = false,
            language = cultureToUse
        });
    }
    catch (Exception ex)
    {
        return Json(new
        {
            error = true,
            exception = true,
            statusText = ex.Message
        });
    }
}

Movie.cs

public class Movie
{
    public int Id { get; set; }
    public string Title { get; set; }
    [DataType(DataType.Date)]
    public DateTime ReleaseData { get; set; }
    public string Genre { get; set; }
    public decimal Price { get; set; }
}

Полный репозиторий

https://github.com/blfuentes/ASP.NET-Core-Movie-Sample

1 Ответ

0 голосов
/ 01 июля 2019

У меня та же проблема при попытке установить испанскую культуру, единственное временное решение, которое я нашел, это заменить функцию validator.methods.date в jquery.validate.globalize.js

$.validator.methods.date = function (value, element) {
    var fecha = new Date(value);
    var dia = fecha.getDate() + 1;
    var mes = fecha.getMonth() + 1;
    var anio = fecha.getFullYear();
    if (dia < 10) {
        dia = '0' + dia;
    };
    if (mes < 10) {
        mes = '0' + mes;
    };
    var newValue = dia + '/' + mes + '/' + anio;
    var val = Globalize.parseDate(newValue, $.validator.methods.dateGlobalizeOptions.dateParseFormat);
    return this.optional(element) || (val instanceof Date);
};

Возможно, это не лучшее решение, но это был единственный способ, которым я смог добиться проверки даты.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...