...

View Full Version : new to javascript. error message not showing



needahelp
06-19-2009, 10: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.

Philip M
06-19-2009, 11:27 AM
An obvious error is

else if((isNaN(parseInt(stripped)))

Validation of the kind
if (strng.length == 0)
is barely worthy of the name as even a single space or a ? will return false (i.e pass the validation).

<script language="JavaScript"> has long been deprecated and is obsolete.

needahelp
06-22-2009, 03:10 PM
i am new to javascript. i still cant figure it out. anyone can help.

Philip M
06-22-2009, 04:39 PM
I have explained one error - you need to change it to

var stripped = strng.replace(/[\(\)\.\-\ ]/g, '');
stripped = parseInt(stripped);
if (isNaN(stripped)) {
error = "The phone number contains illegal characters.";
}

and the length check is in the wrong place. Needs to come after the above.

if(stripped.length != 8) {
error += "The phone number is the wrong length.\n";
}
}
return error;
}


There is also a missing closing brace at the end of function checkMail(strng) {

Another potential source of problems is
name :<input name="name" type="text"><br>
and
<input name="Submit" type="submit"


Suggest you fix the errors in your markup. See http://validator.w3.org/

didn't is so spelled - contraction of did not.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum