Scripts: Javascript :: Date and Time Functions :: Library Article #25
Developer's Section
Validate Dates using Javascript By: Erobo Team Member
|
Hire a Developer for Related Work / Installation | $55 hr
|
|
Rating: | Rate It:
|
Average Votes: (3313)
|
Favorites:
|
|
|
|
Learn a simple technique to validate your input dates.
In this tutorial we will be creating a prototype method in Javascript that will help us validate any date entered from the user's input. The function will take two arguments:
Argument 1: Target Delimiter. e.g. how the user should separate the digits. Common delimiters are '/' or '-'.
Argument 2: Target Format. The order of the year (y), the month (m) and the day (d). Common formats are 'mdy', or 'ymd'.
Example Script:
Enter a Date to Validate:
Now, let's take a look at the code:
| Code Snippet 1 |
|
|
<script language="javascript">
String.prototype.ValidateDate=function(s,f)
{
try
{
//Declare legal characters
var LC = "1234567890" + s;
val=this;
//Clean white space from user's input
//If a weird character is found then return false
var TA = val.split(" ");
var TTW = "";
var newVal = "";
for(var x = 0; x < TA.length; x++) {
if(TA[x] != "" && isNaN(TA[x])) {
for(var w = 0; w < TA[x].length; w++) {
if(LC.indexOf(TA[x].charAt(w)) == -1){
return false;
}
}
TTW = TA[x];
newVal= newVal + TTW.toLowerCase();
}
}
val = newVal;
if(typeof(s)!="string"){
s="/";
}
if(s.length==0){
s="/";
}
if(typeof(f)!="string"){
f="ymd";
}else{
f=f.toLowerCase();
}
for(var i=0;i<3;i++){
switch (f.slice(i,i+1)){
case "y":
y=i;
break;
case "m":
m=i;
break;
case "d":
d=i;
break;
default:
return false;
}
}
val=val.replace(/(^\\s*)|(\\s*$)/g,"");
if(val==""){
return false;
}
var ary=val.split(s,3);
var YY=parseInt(ary[y],10);
var MM=parseInt(ary[m],10);
var DD=parseInt(ary[d],10);
var L=false;
if(isNaN(YY)||YY<1900||YY>2099){
return false;
}
if(isNaN(MM)||MM<1||MM>12){
return false;
}
if(isNaN(DD)||DD<1||DD>31){
return false;
}
if((MM==4||MM==6||MM==9||MM==11)&&DD>30){
return false;
}
if(MM==2){
if(DD>29){
return false;
}
if((YY%100)==0){
if((YY%400)==0){
L=true;
}
}
if(YY%4==0){
L=true;
}
if(!L&&DD>28){
return false;
}
}
return true;
}catch(e)
{
return false;
}
}
</script>
Enter a Date to Validate:
<form>
<input type="text" name="mydate1" value="">
<input type="button" name="validate"
value="Validate Dates of the Form mm/dd/yyyy"
onClick="
if(this.form.mydate1.value.ValidateDate('/','mdy') == true) {
alert('the date:' + this.form.mydate1.value + ' is valid!')
} else {
alert('the date:' + this.form.mydate1.value + ' is invalid!')
}
">
<br><br>
<input type="text" name="mydate2" value="" ID="Text1">
<input type="button" name="validate"
value="Validate Dates of the Form yyyy/mm/dd"
onClick="
if(this.form.mydate2.value.ValidateDate('/','ymd') == true) {
alert('the date:' + this.form.mydate2.value + ' is valid!')
} else {
alert('the date:' + this.form.mydate2.value + ' is invalid!')
}
">
<br><br>
<input type="text" name="mydate3" value="" ID="Text2">
<input type="button" name="validate"
value="Validate Dates of the Form mm-dd-yyyy"
onClick="
if(this.form.mydate3.value.ValidateDate('-','mdy') == true) {
alert('the date:' + this.form.mydate3.value + ' is valid!')
} else {
alert('the date:' + this.form.mydate3.value + ' is invalid!')
}
">
<br><br>
<input type="text" name="mydate4" value="" ID="Text3">
<input type="button" name="validate"
value="Validate Dates of the Form yyyy-mm-dd"
onClick="
if(this.form.mydate4.value.ValidateDate('-','ymd') == true) {
alert('the date:' + this.form.mydate4.value + ' is valid!')
} else {
alert('the date:' + this.form.mydate4.value + ' is invalid!')
}
">
</form>
|
And that's it for now, Hope you learned something new today!.
|
|
See other Scripts in Date and Time Functions |
Submit Your Scripts: |
If you would like to have your Javascripts published in this section please fill out the form below: |