How to validate form input fields? [Archive]

kmp

11-26-2002, 05:57 AM

Hi,

I have form and it's name is test, onSubmit will return a validate().

I can validate whether the user inputs string or number of a field.

But, how can I check whether it is:

1. Blank

2. the length of the number, e.g. 4 digits, no less nor more.

3. only char can be input, no number is allowed

4. double - 1 digit + 2 decimal places, e.g. 8.52

How should I do it?

Thanks

kmp

11-26-2002, 10:08 AM

May I ask you how about Number ONLY, no char?

Thanks a lot.

kmp

11-26-2002, 10:31 AM

miss = "";
var a = document.getElementById("ID").value;
var b = document.Form.name;
var c = document.Form.price;

if (/^\d{8}$/.test(a.value)) {
miss += "\n - ID";
}

if (/^\[a-z]$/i.test(b.value))
{
miss += "\n - name";
}

if (/^\d\.\d{1}$/.test(c.value))
{
miss += "\n - price";
}

The code does not work.

Why le?

I can input anything and submit to the jsp form.

kmp

11-26-2002, 11:34 AM

Sorry, it does not work on IE 5.5.

var miss = "";
var a = document.getElementById("ID").value;
var b = document.form.name.value;
var c = document.form.price.value;

if (/^\d{8}$/.test(a)) {
miss += "\n - ID";
}

if (/^\[a-z]$/i.test(b)) //b with .value, no need here
{
miss += "\n - name";
}

if (/^\d\.\d{1}$/.test(c))
{
miss += "\n - price";
}

Tricky123

11-26-2002, 12:08 PM

This may seem like alot of code but it does more than you ask. It checks for real numbers, integers and date inputs. Have a play and see what you think!!

<html>
<head>
<form name="MyForm" onSubmit="return validateForm()">
<Script Language="JavaScript">

function validateForm()
{

ok = true;

if(ok == true)
{
ok = ValText(document.MyForm.PrintedID_OnameText.value,"D","12/12/2002","12/12/2001","12/12/2000","11/12/2000","F","HIGH MESSAGE","LOW MESSAGE","DateD")
}

if(ok == true)
{
ok = ValText(document.MyForm.print_textthree.value,"R","4","3","2.5","-1.5","F","High 3","Low 3","Real NumberR")
}

if(ok == true)
{
ok = ValText(document.MyForm.printID_Integer.value,"I","1005","1000","995","990","F","tooooo high integer","too low integer","Integer I")
}

if (ok == true)
{
ok = writeCookie()
}

return ok;
}

function ValTextArea(OName,NoEntry,PrintID)
{
if((NoEntry == "F")&&(OName == ""))
{
alert("There is no data in the field: " + PrintID);
return(false);
}
else{return (true);}

}

function ValText(OName,FType,HiHi,Hi,Lo,LoLo,NoEntry,HiMsg,LoMsg,PrintID)
{
//checks to see if no data has been added - requires the onChange script in the HTML section to remove leading white space otherwise if you hit the space bar then it thinks there is data
if((NoEntry == "F")&&(OName == ""))
{alert("There is no data in the field: " + PrintID);
return(false);}

//checks to see if an whole number has been added - whole numbers only
if((FType== "I")&&(parseInt(OName))!=OName)
{alert("NOTE: An Integer (whole number) was not entered in the field: " + PrintID);
return(false);}

if((FType== "I")&&(parseInt(OName)) >= (parseInt(HiHi)))
{alert("WARNING: Data ABOVE the expected limit in the field: " + PrintID);
return(false);}

else if((FType== "I")&&(parseInt(OName)) <= (parseInt(LoLo)))
{alert("WARNING: Data BELOW the expected limit in the field: " + PrintID);
return(false);}

else if(((FType== "I")&&(parseInt(OName)) < (parseInt(HiHi))&&(parseInt(OName)) >= (parseInt(Hi))))
{
if(confirm(HiMsg + ".\n\nCheck the field: " + PrintID + ".\n\nClick OK to accept or Cancel to alter your entry"))
{return(true);}
else
{return(false);}
}

else if(((FType== "I")&&(parseInt(OName)) > (parseInt(LoLo))&&(parseInt(OName)) <= (parseInt(Lo))))
{
if(confirm(LoMsg + ".\n\nCheck the field: " + PrintID + ".\n\nClick OK to accept or Cancel to alter your entry"))
{return(true);}
else
{return(false);}
}

//real numbers only
if((FType== "R")&&(parseFloat(OName))!=OName)
{alert("NOTE: A Real Number was not entered in the field: " + PrintID);
return(false);}

if((FType== "R")&&(parseFloat(OName)) >= (parseFloat(HiHi)))
{alert("WARNING: Data ABOVE the expected limit in the field: " + PrintID);
return(false);}

else if((FType== "R")&&(parseFloat(OName)) <= (parseFloat(LoLo)))
{alert("WARNING: Data BELOW the expected limit in the field: " + PrintID);
return(false);}

else if(((FType== "R")&&(parseFloat(OName)) < (parseFloat(HiHi))&&(parseFloat(OName)) >= (parseFloat(Hi))))
{
if(confirm(HiMsg + ".\n\nCheck the field: " + PrintID + ".\n\nClick OK to accept or Cancel to alter your entry"))
{return(true);}
else
{return(false);}
}

else if(((FType== "R")&&(parseFloat(OName)) > (parseFloat(LoLo))&&(parseFloat(OName)) <= (parseFloat(Lo))))
{
if(confirm(LoMsg + ".\n\nCheck the field: " + PrintID + ".\n\nClick OK to accept or Cancel to alter your entry"))
{return(true);}
else
{return(false);}
}

if(FType=="D")
{
//code to format and validate date inputs - also compares various date values
var DaysInMonth = new Array(12)
var MonthName = new Array(12)
DaysInMonth[1]=31; MonthName[1]="January";
DaysInMonth[2]=29; MonthName[2]="February";
DaysInMonth[3]=31; MonthName[3]="March";
DaysInMonth[4]=30; MonthName[4]="April";
DaysInMonth[5]=31; MonthName[5]="May";
DaysInMonth[6]=30; MonthName[6]="June";
DaysInMonth[7]=31; MonthName[7]="July";
DaysInMonth[8]=31; MonthName[8]="August";
DaysInMonth[9]=30; MonthName[9]="September";
DaysInMonth[10]=31; MonthName[10]="October";
DaysInMonth[11]=30; MonthName[11]="November";
DaysInMonth[12]=31; MonthName[12]="December";

var ValidDate = /^\d{2}\/\d{2}\/\d{4}$/
var Result = OName.match(ValidDate);

if (!Result)
{alert("NOTE: The date you have entered is not in the required format of: dd/mm/yyyy");
return(false);}

var Day = OName.substr(0,2)-0;
var Month = OName.substr(3,2)-0;
var Year = OName.substr(6,4)-0;

if((Month<1)||(Month>12))
{alert("Note: The month you have entered is not a valid month. (1-12 only)");
return(false);}

var MonthDayNumber = DaysInMonth[Month];
var MonthTitle = MonthName[Month];
if((Day<1)||(Day > MonthDayNumber))
{alert("NOTE: The day you entered for the month of " + MonthTitle + " is invalid.\n\nPlease check and re-enter");
return(false);}

if((Day==29)&&(Month==2)&&((Year%4)==0))
{
if(Year % 400==0)
{return(true);}
else if(Year % 100==0)
{alert("NOTE: The day you entered for the month of " + MonthTitle + " is invalid.\n\nPlease check and re-enter");
return(false);}
}

if((Day==29)&&(Month==2)&&((Year%4)!=0))
{alert("NOTE: The day you entered for the month of " + MonthTitle + " is invalid.\n\nPlease check and re-enter");
return(false);}

if((FType== "D")&&(Date.parse(OName)) >= (Date.parse(HiHi)))
{
alert("WARNING: Data ABOVE the expected limit in the field: " + PrintID);
return(false);}

else if((FType== "D")&&(Date.parse(OName)) <= (Date.parse(LoLo)))
{alert("WARNING: Data BELOW the expected limit in the field: " + PrintID);
return(false);}

else if(((FType== "D")&&(Date.parse(OName)) < (Date.parse(HiHi))&&(Date.parse(OName)) >= (Date.parse(Hi))))
{
if(confirm(HiMsg + ".\n\nCheck the field: " + PrintID + ".\n\nClick OK to accept or Cancel to alter your entry"))
{return(true);}
else
{return(false);}
}

else if(((FType== "D")&&(Date.parse(OName)) < (Date.parse(HiHi))&&(Date.parse(OName)) >= (Date.parse(Hi))))
{
if(confirm(LoMsg + ".\n\nCheck the field: " + PrintID + ".\n\nClick OK to accept or Cancel to alter your entry"))
{return(true);}
else
{return(false);}
}

else{return (true);}

}

else{return(true);}

}

</script>


<center>
DATE<input type="text" size="10" maxlength="10" name="PrintedID_OnameText" onChange = "javascript:while(''+this.value.charAt(0)==' ')this.value=this.value.substring(1,this.value.length);"">

REAL NUMBER<input type="text" size="10" name="print_textthree" onChange = "javascript:while(''+this.value.charAt(0)==' ')this.value=this.value.substring(1,this.value.length);"">

INTEGERS<input type="text" size="10" name="printID_Integer" onChange = "javascript:while(''+this.value.charAt(0)==' ')this.value=this.value.substring(1,this.value.length);"">

</center>
</body>
<input type ="SUBMIT" name="submit" value="Submit" >
</form>
</html>

kmp

11-26-2002, 12:33 PM