Jquery Datepicker Chrome - PullRequest
       27

Jquery Datepicker Chrome

25 голосов
/ 11 мая 2011

При использовании jQuery UI Datepicker мы сталкиваемся с проблемой при использовании в Google Chrome: когда мы вводим дату с днем ​​больше 12, она не принимает ее как действительную, потому что chrome считает, что формат даты равен mm/ дд / гггг.Мы попытались решить эту проблему, добавив код, чтобы попытаться принудительно установить настройки даты в дд / мм / гггг

$('.date').datepicker({ dateFormat: "dd/mm/yy" });

Есть ли способ решить эту проблему, поэтому наш сборщик дат примет значения дд / мм / гггг?У нас есть только эта проблема в Google Chrome, datefix работает для Firefox, то есть & Safari.Мы используем ASPX и MVC3 в этом проекте.

Если бы кто-то мог решить нашу проблему, это было бы здорово

Спасибо

Ответы [ 6 ]

45 голосов
/ 24 октября 2011

У меня была такая же проблема, и она связана со всеми веб-браузерами на основе Webkit. Если вы установили заглавную букву M, в текстовом поле будет отображаться мотылек с буквами. Лучшим решением для меня было переопределить функцию проверки даты из jquery.validate.js

Создайте jquery.validate.date.js и убедитесь, что он загружен после jquery.validate.js

Добавьте следующий код в jquery.validate.date.js

$(function() {
    $.validator.methods.date = function (value, element) {
        if ($.browser.webkit) {

            //ES - Chrome does not use the locale when new Date objects instantiated:
            var d = new Date();

            return this.optional(element) || !/Invalid|NaN/.test(new Date(d.toLocaleDateString(value)));
        }
        else {

            return this.optional(element) || !/Invalid|NaN/.test(new Date(value));
        }
    };
});
26 голосов
/ 31 июля 2013

user1011138 решение не работает для меня, так как .toLocaleDateString(value) не анализирует value строку

вот решение, которое я нашел => в jquery.validate.js найти определение этой функции: "date: function (value, element) "и замените код на:

// http://docs.jquery.com/Plugins/Validation/Methods/date
date: function (value, element) {
    var d = value.split("/");
    return this.optional(element) || !/Invalid|NaN/.test(new Date((/chrom(e|ium)/.test(navigator.userAgent.toLowerCase())) ? d[1] + "/" + d[0] + "/" + d[2] : value));
},
4 голосов
/ 12 апреля 2016

Создайте новый файл jquery.validate.date.js.

Вставьте следующий код в файл.

 $(function () {
    $.validator.methods.date = function (value, element) {
      if ($.browser.webkit) {
        var d = new Date();
        return this.optional(element) || !/Invalid|NaN/.test(new Date(d.toLocaleDateString(value)));
      }
      else {
        return this.optional(element) || !/Invalid|NaN/.test(new Date(value));
    }
  };
});

Теперь убедитесь, что этот файл загружен после jquery.validate.JS файл.

3 голосов
/ 24 августа 2016

Вы должны переопределить проверку даты по умолчанию «en-US» с проверкой даты «en-GB».

  • 'en-US' => 'mm / dd / yy'
  • 'en-GB' => 'дд / мм / гг'

Решение:

добавить "jquery.validate.date.js "файл в вашем проекте и поместите в него следующий код:

//To Fix jQuery date format 'en-GB' validation problem in Chrome
$(function () {
    $.validator.addMethod(
        "date",
        function (value, element) {
            var bits = value.match(/([0-9]+)/gi), str;
            if (!bits)
                return this.optional(element) || false;
            str = bits[1] + '/' + bits[0] + '/' + bits[2];
            return this.optional(element) || !/Invalid|NaN/.test(new Date(str));
        },
        "Please enter date in valid format [dd/mm/yyyy]"
    );
});

и убедитесь, что он загружается после 'jquery.validate.min.js':

<script type="text/javascript" src="/Scripts/jquery-3.1.0.min.js"></script>
<script type="text/javascript" src="/Scripts/jquery.validate.min.js"></script>
<script type="text/javascript" src="/Scripts/jquery.validate.date.js"></script>
3 голосов
/ 11 июня 2016

Вышеупомянутые решения не работали, потому что проверка браузера jquery устарела, выбрасывая jquery.validate.min.js Uncaught TypeError: Cannot read property 'webkit' of undefined. Exception occurred when checking element DateOfBirth, check the 'date'

В моем проекте я использую momentjs с начальной загрузкой datetimepicker , поэтомуЭто решение прекрасно работает:

 $(function () {
    $.validator.methods.date = function (value, element) {
        return this.optional(element) || moment(value, 'DD/MM/YYYY').isValid();
  };
});

Вызывайте это сразу после загрузки jquery.validate()

3 голосов
/ 28 ноября 2015
 $.validator.methods.date = function (value, element) {                
            if ($.browser.webkit) {                    
                var d = value.split("/");   
                return this.optional(element) || !/Invalid|NaN/.test(new Date((/chrom(e|ium)/.test(navigator.userAgent.toLowerCase())) ? d[1] + "/" + d[0] + "/" + d[2] : value));
              }
            else {
                return this.optional(element) || !/Invalid|NaN/.test(new Date(value));
            }
        };
...