skip to Main Content

so in the program , there is validate function in which if there is missing field it will give alet message. and in validateEmail if the email is wrong it will also give the alert message. It is showing everything but submit button is not working . It do work when i put return true at the end of validate function but then , if there is email error it shows the error but submit without giving the chance to user to correct the email.

<html>   
   <head>
      <title>Form Validation</title>      
      <script type = "text/javascript">

     
         
        function validate() {
      
         if( document.myForm.Name.value == "" ) {
            alert( "Please provide your name!" );
            document.myForm.Name.focus() ;
            return false;
         }

         if( document.myForm.EMail.value == "" ) {
             alert( "Please provide your Email!" );

            document.myForm.EMail.focus() ;
            return false;

         }
        
         
       
         if( document.myForm.Zip.value == "" || isNaN( document.myForm.Zip.value ) ||
            document.myForm.Zip.value.length != 5 ) {
            
            alert( "Please provide a zip in the format #####." );
            document.myForm.Zip.focus() ;
            return false;
         }
         if( document.myForm.Country.value == "-1" ) {
            alert( "Please provide your country!" );
            return false;
         }
             return false;
              
         }
         
         function validateEmail() {
         var emailID = document.myForm.EMail.value;
         atpos = emailID.indexOf("@");
         dotpos = emailID.lastIndexOf(".");
         
         if (atpos < 1 || ( dotpos - atpos < 2 )) {
            alert("Please enter correct email ID")
            document.myForm.EMail.focus() ;
            return false;
         }
         return( true );
      }
  
      </script>      
   </head>
   
   <body>
      <form action = "submit.html" name = "myForm" onsubmit = "return(validateEmail(),validate());">
         <table cellspacing = "2" cellpadding = "2" border = "1">
            
            <tr>
               <td align = "right">Name</td>
               <td><input type = "text" name = "Name" /></td>
            </tr>
            
            <tr>
               <td align = "right">EMail</td>
               <td><input type = "text" name = "EMail" /></td>
            </tr>
            
            <tr>
               <td align = "right">Zip Code</td>
               <td><input type = "text" name = "Zip" /></td>
            </tr>
            
            <tr>
               <td align = "right">Country</td>
               <td>
                  <select name = "Country">
                     <option value = "-1" selected>[choose yours]</option>
                     <option value = "1">USA</option>
                     <option value = "2">UK</option>
                     <option value = "3">INDIA</option>
                  </select>
               </td>
            </tr>
            
            <tr>
               <td align = "right"></td>
               <td><input type = "submit" value = "Submit" /></td>
            </tr>
            
         </table>
      </form>      
   </body>
</html>

2

Answers


  1. The problem is in the html form tag, in the onsubmit attribute it should be like this :

    onsubmit="return(validateEmail() && validate());" 
    
    Login or Signup to reply.
  2. You are returning false in the validate() function before checking for the email validation. As a result, the form submission is prevented even if the email is correct.

    So, you need to change the return false; statement in the validate() function to return true; after all the validation checks have passed successfully.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search