needahelp
06-19-2009, 09:45 AM
The question is in the QUOTE and my javascript is in the CODE.
My problem is that, whenever i click on Submit, my javascript will not check whether the fields is empty or not and just submit it. instead of showing a alert box like, "The mandatory text area has not been filled in."
1. Create a form with the following fields
Name (required)
Email (required)
Address (optional)
Contact Number (optional, local)
Gender (M/F) (optional)
Color Theme: Metal, Wood, Water, Fire and Earth (required, choose one)
Interest: Movie, Food, Sport, Shopping (optional, select many)
2. If entry is required, validate that correct data is entered.
Remind user to enter if missing.
If any information is missing or incorrect, the form should not be submitted.
3. If there are no errors in the form, open up another html page (e.g. register.html).
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Check Input</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<script src="validate.js"></script>
<script language="JavaScript" type="text/javascript">
// function for empty
function isEmpty(strng)
{
var error = "";
if (strng.length == 0)
{
error = "The mandatory text area has not been filled in.\n";
}
return error;
}
// function for name req
function checkName(strng)
{
var error = "";
if (isEmpty(strng))
{
error = "You did'nt enter your name.\n";
}
var illegalChars = /\W/;
if(illegalChars.test(strng))
{
error = "Your name contains illegal characters.\n";
}
return error;
}
// function for mail req
function checkMail(strng)
{
var error = "";
if (isEmpty(strng))
{
error = "You did'nt enter your email address.\n";
var emailFilter=/^.+@.+\..{2,3}$/;
if (!(emailFilter.test(strng)))
{
error = "Please enter a valid email address.\n";
}
var illegalChars= /[\(\)\<\>\,\;\:\\\"\[\]]/
if (strng.match(illegalChars))
{
error = "The email address contains illegal characters.\n";
}
return error;
}
// function for contact number op
function checkNumber(strng)
{
var error = "";
if (!(isEmpty(strng)))
{
if(!(stripped.length == 8))
{
error = "The phone number is the wrong length.\n";
}
var stripped = strng.replace(/[\(\)\.\-\ ]/g, '');
else if((isNaN(parseInt(stripped)))
{
error = "The phone number contains illegal characters.";
}
}
}
// function for color theme req
function ColorTheme(choice)
{
var error = "";
if (choice == 0)
{
error = "You did'nt enter the color theme.\n";
}
return error;
}
// function for checking
function checkInputForm(theForm)
{
var why = "";
why += checkName(theForm.name.value);
why += checkMail(theForm.email.value);
why += ColorTheme(theForm.color.selectedIndex);
why += checkNumber(theForm.number.value);
if (why != "")
{
alert(why);
return false;
}
return true;
}
</script>
<body>
<form action="file:///D|/advweb/L10/view.htm" name="Particular" id="Particular" method="post" onSubmit="return checkInputForm(this)">
name :<input name="name" type="text"><br>
email :<input name="email" type="text"><br>
address(optional) :<input name="address" type="text"><br>
contact number(optional) :<input name="number" type="text"><br>
Gender(optional) :<input name="gender" type="radio" value="male">Male<input name="gender" type="radio" value="Female">Female<br>
Color Theme: <SELECT name="color">
<OPTION value=" ">
<OPTION value="Metal">Metal
<OPTION value="Wood">Wood
<OPTION value="Water">Water
<OPTION value="Fire">Fire
<OPTION value="Earth">Earth
</SELECT><br>
Interest(optional) :<input name="interest" type="checkbox" value="Movie">Movie
<input name="interest" type="checkbox" value="Food">Food
<input name="interest" type="checkbox" value="Sport">Sport
<input name="interest" type="checkbox" value="Shopping">Shopping<br>
<input name="Submit" type="submit" value="Submit">
</form>
</body>
</html>
Anyway, my email is wizard_9912@hotmail.com.
I hope someone could add me up and teach me via MSN so it will be faster.
My problem is that, whenever i click on Submit, my javascript will not check whether the fields is empty or not and just submit it. instead of showing a alert box like, "The mandatory text area has not been filled in."
1. Create a form with the following fields
Name (required)
Email (required)
Address (optional)
Contact Number (optional, local)
Gender (M/F) (optional)
Color Theme: Metal, Wood, Water, Fire and Earth (required, choose one)
Interest: Movie, Food, Sport, Shopping (optional, select many)
2. If entry is required, validate that correct data is entered.
Remind user to enter if missing.
If any information is missing or incorrect, the form should not be submitted.
3. If there are no errors in the form, open up another html page (e.g. register.html).
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Check Input</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<script src="validate.js"></script>
<script language="JavaScript" type="text/javascript">
// function for empty
function isEmpty(strng)
{
var error = "";
if (strng.length == 0)
{
error = "The mandatory text area has not been filled in.\n";
}
return error;
}
// function for name req
function checkName(strng)
{
var error = "";
if (isEmpty(strng))
{
error = "You did'nt enter your name.\n";
}
var illegalChars = /\W/;
if(illegalChars.test(strng))
{
error = "Your name contains illegal characters.\n";
}
return error;
}
// function for mail req
function checkMail(strng)
{
var error = "";
if (isEmpty(strng))
{
error = "You did'nt enter your email address.\n";
var emailFilter=/^.+@.+\..{2,3}$/;
if (!(emailFilter.test(strng)))
{
error = "Please enter a valid email address.\n";
}
var illegalChars= /[\(\)\<\>\,\;\:\\\"\[\]]/
if (strng.match(illegalChars))
{
error = "The email address contains illegal characters.\n";
}
return error;
}
// function for contact number op
function checkNumber(strng)
{
var error = "";
if (!(isEmpty(strng)))
{
if(!(stripped.length == 8))
{
error = "The phone number is the wrong length.\n";
}
var stripped = strng.replace(/[\(\)\.\-\ ]/g, '');
else if((isNaN(parseInt(stripped)))
{
error = "The phone number contains illegal characters.";
}
}
}
// function for color theme req
function ColorTheme(choice)
{
var error = "";
if (choice == 0)
{
error = "You did'nt enter the color theme.\n";
}
return error;
}
// function for checking
function checkInputForm(theForm)
{
var why = "";
why += checkName(theForm.name.value);
why += checkMail(theForm.email.value);
why += ColorTheme(theForm.color.selectedIndex);
why += checkNumber(theForm.number.value);
if (why != "")
{
alert(why);
return false;
}
return true;
}
</script>
<body>
<form action="file:///D|/advweb/L10/view.htm" name="Particular" id="Particular" method="post" onSubmit="return checkInputForm(this)">
name :<input name="name" type="text"><br>
email :<input name="email" type="text"><br>
address(optional) :<input name="address" type="text"><br>
contact number(optional) :<input name="number" type="text"><br>
Gender(optional) :<input name="gender" type="radio" value="male">Male<input name="gender" type="radio" value="Female">Female<br>
Color Theme: <SELECT name="color">
<OPTION value=" ">
<OPTION value="Metal">Metal
<OPTION value="Wood">Wood
<OPTION value="Water">Water
<OPTION value="Fire">Fire
<OPTION value="Earth">Earth
</SELECT><br>
Interest(optional) :<input name="interest" type="checkbox" value="Movie">Movie
<input name="interest" type="checkbox" value="Food">Food
<input name="interest" type="checkbox" value="Sport">Sport
<input name="interest" type="checkbox" value="Shopping">Shopping<br>
<input name="Submit" type="submit" value="Submit">
</form>
</body>
</html>
Anyway, my email is wizard_9912@hotmail.com.
I hope someone could add me up and teach me via MSN so it will be faster.