lets start:
first declare variables (Array) to hold our form elements values
var Values = Array(); // For Values
var type = Array(); // Type Ex ('Email, Number, Text, etc...')
var Msg = Array(); // in case of empty or type not matching show message
var msg = null; // this variable is show the final message,
this function is assigning the value variables,
i variable is for index of array (you can access a value from array by using index of that value).
index of array is starting from 0(zero)
function set(i,value,Type,message)
{
name[i] = value;
type[i]=Type;
Msg[i]=message;
}
who to use it? just call this function and pass the value of form element:
var ele = document.getElementById(element_id).value; set(0 // this is index of array, or key of value which we are passing to values array, for second element we will pass 1 set(0,ele,"Number","Not A Number - Please Type a Valid Number");
for making our code easy lets create another function for getting form value and returning it to set function.
function ele(name) // simply pass id of form element and it will return value of passed element.
{
return document.getElementById(name).value;
}
and example of the above code
set(0,ele('txtUsername'),"Text","-Please Type Username\r\n");
set(1,ele('txtPassword'),"Text","-Please Type Password\r\n");
var error = false;when and error Occur we will change it to true.
msg = "Follwoing Field(s) Required\r\n"; when and error Occur we will add message From Msg variable
function r()
{
var error = false;
msg = "Follwoing Field(s) Required\r\n";
for(var i in name) // for loop. it is checking each Value in Values variable
{
var val = name[i];
if(val=="" || val==null) //checking if it is null or emtpy if yes then
{
error = true; // change error variable to true
if(msg.indexOf(Msg[i]) == -1) // handling dublicate message
{
msg+=Msg[i]; //adding message form Msg variable
}
}
switch(type[i]) // using switch for checking type from Type variable
{
case "Email": //Checking For Email.
if(val.indexOf('@')== -1 && val.indexOf('.')==-1)
{
error = true;
if(msg.indexOf(Msg[i]) == -1)
{
msg+=Msg[i];
}
}
break;
case "Number": // checking
num = parseFloat(val);
if(isNaN(num))
{
error = true;
if(msg.indexOf(Msg[i]) == -1)
{
msg+=Msg[i];
}
}
break;
}
}
return error; // and finally return the error (true or false).
}
and how to use it
<script src="javascript.js" language="javascript"></script>
<form name="form1" method="post" action="">
<table width="500" border="0" cellspacing="0" cellpadding="2">
<tr>
<td width="121">Username</td>
<td width="379"><label>
<input type="text" name="username" id="username">
</label></td>
</tr>
<tr>
<td>Password</td>
<td><label>
<input type="text" name="password" id="password">
</label></td>
</tr>
<tr>
<td>Email</td>
<td><label>
<input type="text" name="email" id="email">
</label></td>
</tr>
<tr>
<td>Mobile</td>
<td><label>
<input type="text" name="mobile" id="mobile">
</label></td>
</tr>
<tr>
<td> </td>
<td><label>
<input type="button" name="button" id="button" value="Submit" onclick="val();">
</label></td>
</tr>
</table>
</form>
<script language="javascript">
function val()
{
set(0,ele('username'),"Text","-Please Type Username\r\n");
set(1,ele('password'),"Text","-Please Type Password\r\n");
set(2,ele('email'),'Email','-Pleaes Type a Valid Email Address\r\n');
set(3,ele('mobile'),'Number','-Please Type a Valid Number');
// Here You can pass more elements.
check();
if(check())
{
alert(msg);
}
else
{
document.getElementById('frmlogin').submit();
}
}
function ele(name)
{
return document.getElementById(name).value;
}
</script>

Add Reply





MultiQuote
| 


