Wie kann ich ein benutzerdefiniertes Datumsformat angeben, das mit dem Validierungs-Plugin für jQuery validiert werden soll ?
Wie kann ich ein benutzerdefiniertes Datumsformat angeben, das mit dem Validierungs-Plugin für jQuery validiert werden soll ?
Antworten:
Mit der addMethod
Funktion können Sie Ihre eigene benutzerdefinierte Validierungsmethode erstellen . Angenommen, Sie wollten "TT / MM / JJJJ" validieren:
$.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."
);
Und dann fügen Sie auf Ihrem Formular hinzu:
$('#myForm')
.validate({
rules : {
myDate : {
australianDate : true
}
}
})
;
myDate
den Namen des Datumseingabefelds ändern sollten .
Die Antwort von nickf ist gut, aber beachten Sie, dass das Validierungs-Plug-In bereits Validatoren für mehrere andere Datumsformate in der Datei Additional-methods.js enthält. Stellen Sie vor dem Schreiben Ihrer eigenen sicher, dass dies noch nicht geschehen ist.
Ich persönlich benutze die sehr gute http://www.datejs.com/ Bibliothek.
Docco hier: http://code.google.com/p/datejs/wiki/APIDocumentation
Sie können Folgendes verwenden, um Ihr australisches Format abzurufen und den Schalttag am 29.02.2012 und nicht am 29.02.2011 zu validieren:
jQuery.validator.addMethod("australianDate", function(value, element) {
return Date.parseExact(value, "d/M/yyyy");
});
$("#myForm").validate({
rules : {
birth_date : { australianDate : true }
}
});
Ich verwende auch das maskierte Eingabe-Plugin, um die Daten zu standardisieren. Http://digitalbush.com/projects/masked-input-plugin/
$("#birth_date").mask("99/99/9999");
Hier ist ein Beispiel für eine neue Validierungsmethode, mit der nahezu jedes Datumsformat validiert werden kann, einschließlich:
Wenn Sie den Wert dann an das PHP übergeben, können Sie ihn mit strtotime konvertieren
So fügen Sie die Methode hinzu:
$.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!"
);
Dann fügen Sie den neuen Filter hinzu mit:
$('#myForm')
.validate({
rules : {
field: {
anyDate: true
}
}
})
;;
mmm
/^(0?[1-9]|[12][0-9]|3[0-1])[/., -](0?[1-9]|1[0-2]|[a-zA-Z]{3})[/., -](19|20)?\d{2}$/
Hier ist ein spezielles Codebeispiel, das kürzlich für mich funktioniert hat:
// 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"
);
Ich sollte beachten, dass dies tatsächlich die integrierte Routine zur Datumsüberprüfung ersetzt, obwohl ich nicht sehen konnte, dass dies ein Problem mit dem aktuellen Plugin verursachen sollte.
Ich habe dies dann auf das Formular angewendet, indem ich:
$( '#my_form input.date' ).rules( 'add', { date: true } );
Ich kombiniere / ändere frühere Beiträge, um mein gewünschtes Ergebnis zu erzielen:
// 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"
);
Fügen Sie nach Ihrer Validierungskonfiguration eine Datumsüberprüfung hinzu. Dh nach dem Aufruf der Methode $ (form) .validate ({...}).
//Add date validation (if applicable)
$('.date', $(frmPanelBtnId)).each(function () {
$(this).rules('add', {
date: true
});
});
Schließlich wurde die Hauptfunktion isDate Javascript für das UK-Datumsformat geändert
//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;
}
Jon, du hast einige Syntaxfehler, siehe unten, das hat bei mir funktioniert.
<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
}
}
});
});
$.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);
});
Sie können wie eingeben yyyy-mm-dd
auchyyyy/mm/dd
aber ich kann die Größe des Monats nicht irgendwann im Februar nur 28 oder 29 Tage beurteilen.
Check out: jQuery Masked Input Plugin
@blasteralfred:
Ich habe die folgende Regel zur Bestätigung des korrekten Datums für mich erhalten (TT MM JJJJ)
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"
);
Für TT / MM / JJJJ
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"
);
Dies gilt nicht für den 13.01.2017 und den 13.01.2017.
Und validiert auch nicht 50 12 2017 und 50/12/2017.
Ist einfach, Beispiel: Gültig für HTML5 automatisch type = "date" .
<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();
}
});
});
// put your own logic here, this is just a (crappy) example