Пользовательский формат даты с плагином проверки jQuery

Question

Как я могу указать персонализированную форму даты для проверки с помощью Validation Plugin для jQuery?

Answer 1

Вы можете создать свой собственный метод проверки, используя функцию addMethod. Скажем, вы хотите, чтобы проверить «дд/мм/гггг»:

$.validator.addMethod(
    "australianDate", 
    function(value, element) { 
     // put your own logic here, this is just a (crappy) example 
     return value.match(/^\d\d?\/\d\d?\/\d\d\d\d$/); 
    }, 
    "Please enter a date in the format dd/mm/yyyy." 
); 

а затем на вашей форме добавить: ответ

$('#myForm') 
    .validate({ 
     rules : { 
      myDate : { 
       australianDate : true 
      } 
     } 
    }) 
; 

Answer 2

nickf это хорошо, но обратите внимание, что проверка плагин уже включает в себя валидаторы для нескольких других форматов даты, в файле дополнительных методов.js. Прежде чем писать самостоятельно, убедитесь, что кто-то еще этого не сделал.

Answer 3

Отъезд: jQuery Masked Input Plugin

Answer 4

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

<script type="text/javascript"> 
$(document).ready(function() { 

    $.validator.addMethod(
     "australianDate", 
     function (value, element) { 
     // put your own logic here, this is just a (crappy) example 
     return value.match(/^\d\d?\/\d\d?\/\d\d\d\d$/); 
     }, 
     "Please enter a date in the format dd/mm/yyyy" 
    ); 

    $('#testForm').validate({ 
    rules: { 
     "myDate": { 
     australianDate: true 
     } 
    } 
    }); 

});    

Answer 5

Я лично использую очень хорошую http://www.datejs.com/ библиотеку.

Docco здесь: http://code.google.com/p/datejs/wiki/APIDocumentation

Вы можете использовать следующие, чтобы получить ваш австралийский формат и будет проверять високосный день 29.02.2012 и не 29/02/2011:

jQuery.validator.addMethod("australianDate", function(value, element) { 
    return Date.parseExact(value, "d/M/yyyy"); 
}); 

$("#myForm").validate({ 
    rules : { 
     birth_date : { australianDate : true } 
    } 
}); 

Я также использовать в маске ввода плагин, чтобы стандартизировать данные http://digitalbush.com/projects/masked-input-plugin/

$("#birth_date").mask("99/99/9999"); 

Answer 6

Вот конкретный пример кода, который работал для меня в последнее время:

// Replace the builtin US date validation with UK date validation 
$.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 a date in the format dd/mm/yyyy" 
); 

Следует отметить, что это фактически заменяет встроенную процедуру проверки даты, хотя я не мог видеть, что это должно вызвать проблему с текущим плагином.

Я тогда применяется это к форме, используя:

$('#my_form input.date').rules('add', { date: true }); 

Answer 7

$.validator.addMethod("mydate", function (value, element) { 

     return this.optional(element) || /^(\d{4})(-|\/)(([0-1]{1})([1-2]{1})|([0]{1})([0-9]{1}))(-|\/)(([0-2]{1})([1-9]{1})|([3]{1})([0-1]{1}))/.test(value); 

    }); 

вы можете ввести как yyyy-mm-dd также yyyy/mm/dd

, но не может судить размер месяца где-то февраль только 28 или 29 дней.

Answer 8

Это я комбинируя/модифицирования предыдущие сообщения для достижения моей желаемого результата: проверка

 // Override built-in date validator 
     $.validator.addMethod(
      "date", 
      function (value, element) { 
       //Return   NB: isRequired is not checked at this stage 
       return (value=="")? true : isDate(value); 
      }, 
      "* invalid" 
     ); 

Дата добавления после проверки конфигурации. То есть после вызова метода $ (form) .validate ({...}).

 //Add date validation (if applicable) 
     $('.date', $(frmPanelBtnId)).each(function() { 
      $(this).rules('add', { 
       date: true 
      }); 
     }); 

Наконец, основной функцией IsDate Javascript модифицирована для Великобритании Формат даты

//Validates a date input -- http://jquerybyexample.blogspot.com/2011/12/validate-date- using-jquery.html 
function isDate(txtDate) { 
    var currVal = txtDate; 
    if (currVal == '') 
     return false; 

    //Declare Regex 
    var rxDatePattern = /^(\d{1,2})(\/|-)(\d{1,2})(\/|-)(\d{4})$/; 
    var dtArray = currVal.match(rxDatePattern); // is format OK? 

    if (dtArray == null) 
     return false; 

    //Checks for dd/mm/yyyy format. 
    var dtDay = dtArray[1]; 
    var dtMonth = dtArray[3]; 
    var dtYear = dtArray[5]; 

    if (dtMonth < 1 || dtMonth > 12) 
     return false; 
    else if (dtDay < 1 || dtDay > 31) 
     return false; 
    else if ((dtMonth == 4 || dtMonth == 6 || dtMonth == 9 || dtMonth == 11) && dtDay == 31) 
     return false; 
    else if (dtMonth == 2) { 
     var isleap = (dtYear % 4 == 0 && (dtYear % 100 != 0 || dtYear % 400 == 0)); 
     if (dtDay > 29 || (dtDay == 29 && !isleap)) 
      return false; 
    } 

    return true; 
} 

Answer 9

Вот пример для нового метода проверки, который будет проверять практически любой формат даты, в том числе:

• dd/mm/yy или dd/mm/yyyy
• dd.mm.yy или dd.mm.yyyy
• дд, мм, гггг или дд, мм, гггг
• дд мм гггг или дд мм гггг
• дд-мм-гггг или дд-мм-гггг

Затем, когда вы передаете значение в PHP вы можете преобразовать его с strtotime

Вот как добавить метод:

$.validator.addMethod("anyDate", 
    function(value, element) { 
     return value.match(/^(0?[1-9]|[12][0-9]|3[0-1])[/., -](0?[1-9]|1[0-2])[/., -](19|20)?\d{2}$/); 
    }, 
    "Please enter a date in the format!" 
); 

Затем вы добавляете новый фильтр с:

$('#myForm') 
.validate({ 
    rules : { 
     field: { 
      anyDate: true 
     } 
    } 
}) 

;

Answer 10

Прост, пример: Действительно для HTML5 автоматический тип = "дата".

<script type="text/javascript" src="//ajax.aspnetcdn.com/ajax/jquery.validate/1.14.0/jquery.validate.min.js"></script> 
<script type="text/javascript" src="//ajax.aspnetcdn.com/ajax/jquery.validate/1.14.0/additional-methods.min.js"></script> 
<script type="text/javascript" src="//ajax.aspnetcdn.com/ajax/jquery.validate/1.14.0/localization/messages_es.js"></script> 

$(function() { 

     // Overload method default "date" jquery.validate.min.js 
     $.validator.addMethod(
      "date", 
      function(value, element) { 
       var dateReg = /^\d{2}([./-])\d{2}\1\d{4}$/; 
       return value.match(dateReg); 
      }, 
      "Invalid date" 
     ); 

    // Form Demo jquery.validate.min.js 
    $('#form-datos').validate({ 
     submitHandler: function(form) { 
      form.submit(); 
     } 
    }); 

}); 

Answer 11

@blasteralfred:

я получил следующее правило проверяющий правильную дату для меня (ДД ММ ГГГГ)

jQuery.validator.addMethod(
"validDate", 
function(value, element) { 
    return value.match(/(?:0[1-9]|[12][0-9]|3[01]) (?:0[1-9]|1[0-2]) (?:19|20\d{2})/); 
}, 
"Please enter a valid date in the format DD MM YYYY" 

);

Для ДД/ММ/YYYY

jQuery.validator.addMethod(
"validDate", 
function(value, element) { 
    return value.match(/(?:0[1-9]|[12][0-9]|3[01])\/(?:0[1-9]|1[0-2])\/(?:19|20\d{2})/); 
}, 
"Please enter a valid date in the format DD/MM/YYYY" 

);

Это не будет подтверждено 01 13 2017 и 01/13/2017.

А также не подтверждает 50 12 2017 и 50/12/2017.