Ненавязчивая проверка в Chrome не будет проверять с помощью dd / mm/yyyy


Я пытаюсь использовать самый простой возможный сценарий, используя средство выбора даты в разных браузерах. Я подозреваю, что я делаю что-то очень простое неправильный путь, но после многих поисков вокруг я до сих пор не нашел решения. Ниже приведен пример кода, который представляет то, что я пытаюсь.

Если я использую Chrome (v12.0.742.122) и выбираю дату из средства выбора, например 13/08/2011, логика проверки jQuery не позволит отправить страницу, хотя я явно указал формате 'ДД/ММ/гг'.

если я изменю формат на 'dd/M/yy' и выберу дату, например 13/Aug / 2011, он работает в Chrome, но затем не будет отправляться для меня в IE (v8.0.7600.16385). В FireFox (v3.6.18) работают оба формата.

какой сценарий проверки мне нужно иметь возможность поддерживать форматы дат 'dd/mm / yy' в Chrome?

<html>
 <head>
  <link rel="stylesheet" type="text/css" href="jquery-ui.css" />
  <script type="text/javascript" src="jquery-1.4.4.js"></script>
  <script type="text/javascript" src="jquery.validate.js"></script>
  <script type="text/javascript" src="jquery.validate.unobtrusive.js"></script>
  <script type="text/javascript" src="jquery-ui.js"></script>
  <script type="text/javascript">
      $(document).ready(function () {
    $('.date').datepicker({ dateFormat: 'dd/mm/yy' });
            $.validator.addMethod("dateRule", function(value, element) {
      return true;
    },
    "Error message");
      });
  </script>
 </head>
 <body>
    <form>
        Date: <input type="text" name="myDate" class="date dateRule" />
        <input type="submit" />
    </form>
 </body>
</html>
12 52

12 ответов:

четыре часа спустя я, наконец, наткнулись на ответ. По какой-то причине Chrome, похоже, имеет некоторое встроенное пристрастие к использованию форматов даты США, где IE и FireFox могут быть разумными и использовать региональные настройки в ОС.

jQuery.validator.methods["date"] = function (value, element) { return true; } 

вы можете использовать глобализацию.плагин js доступен здесь:https://github.com/jquery/globalize

затем просто переопределите метод validate в главном файле скрипта вашего веб-сайта следующим образом (избегайте редактирования jquery.утверждать.файл библиотеки js, как вы можете обновить его в будущем):

$.validator.methods.date = function (value, element) {
    return this.optional(element) || Globalize.parseDate(value, "d/M/y", "en");
}

Я знаю, что немного опоздал на вечеринку, но вот решение, которое я использовал для проверки Chrome, не принимая даты формата UK. Простая проверка подключи и играй, она не зависит от каких-либо плагинов или изменения каких-либо файлов. Он будет принимать любую дату между 1/1/1900 и 31/31/2999, поэтому формат США или Великобритании. Очевидно, что есть недопустимые даты, которые будут прокрасться мимо, но вы можете настроить регулярное выражение для вашего сердца. Это удовлетворило мои потребности, так как он будет использоваться на низкой области трафика сайта, с серверной стороны утверждение. Площадь территории в вопрос строится с ASP.net в MVC.

jQuery.validator.methods.date = function(value, element) {
    var dateRegex = /^(0?[1-9]\/|[12]\d\/|3[01]\/){2}(19|20)\d\d$/;
    return this.optional(element) || dateRegex.test(value);
};

похоже, эта проблема была поднята с командой JQuery.

https://github.com/jzaefferer/jquery-validation/issues/153

похоже, что обходной путь на данный момент заключается в использовании dateITA в дополнительные-методы.js

это выглядит так:

jQuery.validator.addMethod(
    "dateITA",
    function(value, element) {
        var check = false;
        var re = /^\d{1,2}\/\d{1,2}\/\d{4}$/;
        if( re.test(value)){
            var adata = value.split('/');
            var gg = parseInt(adata[0],10);
            var mm = parseInt(adata[1],10);
            var aaaa = parseInt(adata[2],10);
            var xdata = new Date(aaaa,mm-1,gg);
            if ( ( xdata.getFullYear() == aaaa ) 
                   && ( xdata.getMonth () == mm - 1 ) 
                   && ( xdata.getDate() == gg ) )
                check = true;
            else
                check = false;
        } else
            check = false;
        return this.optional(element) || check;
    },
    "Please enter a correct date"
);

Если вы добавите этот валидатор, вы можете прикрепить свой datepicker к '.дата начала занятий.

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

это остается проблемой в .net mvc4, где EditorForDateTime по-прежнему производит data-val-date атрибут, несмотря на четкую документацию в плагине проверки jQuery, чтобы не использовать его!!! Надеюсь, microsoft исправит это и data-val-date никогда не слышал!

в то же время вы можете использовать предложенную библиотеку через modernizr:

yepnope({
    test: isNaN(Date.parse("23/2/2012")),
    nope: 'http://ajax.aspnetcdn.com/ajax/jquery.validate/1.13.0/additional-methods.min.js',
    complete: function () {
        $.validator.methods.date = $.validator.methods.dateITA
    }
});

или если вы не хотите использовать yepnope / modernizr и избавиться от компонента UTC метода dateITA (если вы используете эту библиотеку для введите местное время, даты не всегда будут подтверждаться в 1-й или последний день месяца, если только на линии Гринвича-т. е. UTC +0):

(function ($) {
    var invokeTestDate = function () {
        return $.validator.methods.date.call({
            optional: function () {
                return false;
            }, (new Date(2012,8,23)).toLocaleDateString(), null);
    };
    if (invokeTestDate()) {
        return;
    }

    // http://docs.jquery.com/Plugins/Validation/Methods/date

    $.validator.methods.date = function (value, element) {
        //ES - Chrome does not use the locale when new Date objects instantiated:
        //return this.optional(element) || !/Invalid|NaN/.test(new Date(value));
        var d = new Date();
        return this.optional(element) || !/Invalid|NaN/.test(new Date(d.toLocaleDateString(value)));
    }
})(jQuery);

мы используем следующее Для работы над нашими проектами;

if ($.validator) {
    $.validator.addMethod("date",
        function (value, element, params) {
            if (this.optional(element)) {
                return true;
            }

            var ok = true;
            try {
                $.datepicker.parseDate("dd/mm/yy", value);
            }
            catch (err) {
                ok = false;
            }
            return ok;
        });
}

может этот код поможет вам.

$.validator.addMethod(
         "date",
         function(value, element) {
              var check = false;
              var re = /^\d{1,2}\/\d{1,2}\/\d{4}$/;
              var reBR = /^\d{4}\-\d{1,2}\-\d{1,2}$/;
              if( re.test(value)){
                   var adata = value.split('/');
                   var gg = parseInt(adata[0],10);
                   var mm = parseInt(adata[1],10);
                   var aaaa = parseInt(adata[2],10);
                   var xdata = new Date(aaaa,mm-1,gg);
                   if ( ( xdata.getFullYear() == aaaa ) && ( xdata.getMonth () == mm - 1 ) && ( xdata.getDate() == gg ) )
                        check = true;
                   else
                        check = false;
              } else if( reBR.test(value)){
                   var adata = value.split('-');
                   var aaaa = parseInt(adata[0],10);
                   var mm = parseInt(adata[1],10);
                   var gg = parseInt(adata[2],10);
                   var xdata = new Date(aaaa,mm-1,gg);
                   if ( ( xdata.getFullYear() == aaaa ) && ( xdata.getMonth () == mm - 1 ) && ( xdata.getDate() == gg ) )
                        check = true;
                   else
                        check = false;
              } else
                   check = false;
                   console.log(check);
              return this.optional(element) || check;
         },
         "Por favor insira uma data válida"
    );

следует изменить метод dateRule, который вы определяете в validate to (регулярное выражение просто простое, например):

$.validator.addMethod(
    "dateRule",
    function(value, element) {
        return value.match(/^\d\d?\/\d\d?\/\d\d$/);
    },
    "Please enter a date in the format dd/mm/yy"
);

вы можете переключить регулярное выражение для всего, что вы хотите. Я получил это регулярное выражение для даты от здесь, который обслуживает м/д/гг или М/Д/гггг или ММ/ДД/гггг или ММ/ДД/гг: 1/1/1920 через 12/31/2019; февраля 29 и 30 всегда допускается

^((0?[13578]|10|12)(-|\/)(([1-9])|(0[1-9])|([12])([0-9]?)|(3[01]?))(-|\/)((19)([2-9])(\d{1})|(20)([01])(\d{1})|([8901])(\d{1}))|(0?[2469]|11)(-|\/)(([1-9])|(0[1-9])|([12])([0-9]?)|(3[0]?))(-|\/)((19)([2-9])(\d{1})|(20)([01])(\d{1})|([8901])(\d{1})))$

Я нашел решение, которое, кажется, работает для любой культуры.

http://devdens.blogspot.com/2011/11/jquery-validation-fix-for-date-format_29.html

Он требует, чтобы вы изменили фактический jquery.вальдиация.минута.js файл, но пока он работает для меня.

это единственное решение, которое работает для меня: http://www.codeproject.com/Tips/579279/Fixing-jQuery-non-US-Date-Validation-for-Chrome

 jQuery.extend(jQuery.validator.methods, {
        date: function (value, element) {
            var isChrome = window.chrome;
            // make correction for chrome
            if (isChrome) {
                var d = new Date();
                return this.optional(element) || 
                !/Invalid|NaN/.test(new Date(d.toLocaleDateString(value)));
            }
            // leave default behavior
            else {
                return this.optional(element) || 
                !/Invalid|NaN/.test(new Date(value));
            }
        }
    }); 

Я обнаружил, что самым простым исправлением этой ошибки является следующий фрагмент кода после вызова вашего файла проверки;

    jQuery.validator.methods["date"] = function (value, element){
        var shortDateFormat = "dd/mm/yy";
        var res = true;
        try {
            $.datepicker.parseDate(shortDateFormat, value);
        } catch (error) {
            res = false;
        }
        return res;
    }

даже в версиях, найденных в 2016 году, у меня все еще есть эта проблема без вышеуказанного кода в Chrome, а не Firefox.

Это мое предпочтительное решение, так как оно не требует никаких дополнительных библиотек или плагинов для работы.

Я нашел этот фрагмент кода во время поиска проблемы здесь.

или мы могли бы попытаться перезаписать валидатор вместо того, чтобы игнорировать его.

$.validator.addMethod("date", function (value, element) {
    var result = true;
    try {
        $.datepicker.parseDate('dd/mm/yy', value);
    }
    catch (err) {
        result = false;
    }
    return result;
});