Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Jun 2009
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    new to javascript. error message not showing

    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).
    Code:
    <!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.
    Last edited by needahelp; 06-19-2009 at 10:02 AM.

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,928
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    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.

  • #3
    New to the CF scene
    Join Date
    Jun 2009
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    i am new to javascript. i still cant figure it out. anyone can help.

  • #4
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,928
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    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.
    Last edited by Philip M; 06-22-2009 at 04:14 PM.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •