Web Analytics Made Easy -
StatCounter Form onSubmit alert - CodingForum

Announcement

Collapse
No announcement yet.

Form onSubmit alert

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Form onSubmit alert

    I want have an alert pop up if the email is invalid and have the form not post. I have tried countless ways but cannot figure it out. No matter what I do, it always posts. Thanks in advance for the help.


    Code:
    <html>
    <head>
    <script language = "Javascript">
    
    
    
    function echeck(str) {
    
    
    	var at = "@"
    	var dot = "."
    	var lat = str.indexOf(at)
    	var lstr = str.length
    	var ldot = str.indexOf(dot)
    	
    	if(str.indexOf(at) == -1) {
    		alert("Invalid E-mail ID")
    		return false
    	}
    	if(str.indexOf(at) == -1 || str.indexOf(at) == 0 || str.indexOf(at) == lstr) {
    		alert("Invalid E-mail ID")
    		return false
    	}
    	if(str.indexOf(dot) == -1 || str.indexOf(dot) == 0 || str.indexOf(dot) == lstr) {
    		alert("Invalid E-mail ID")
    		return false
    	}
    	if(str.indexOf(at, (lat + 1)) != -1) {
    		alert("Invalid E-mail ID")
    		return false
    		 
    	}
    
    	if(str.substring(lat - 1, lat) == dot || str.substring(lat + 1, lat + 2) == dot) {
    		alert("Invalid E-mail ID")
    		    
    		return false
    		 
    	}
    
    		 
    	if(str.indexOf(dot, (lat + 2)) == -1) {
    		alert("Invalid E-mail ID")
    		    
    		return false
    		 
    	}
    		
    		 
    	if(str.indexOf(" ") != -1) {
    		alert("Invalid E-mail ID")
    		    
    		return false
    		 
    	}
    
     		 
    	return true					
    	
    }
    
    
    
    function ValidateForm() {
    	Var emailID = document.frmSample.txtEmail
    
    	if((emailID.value == null) || (emailID.value == "")) {
    		
    		alert("Please Enter your Email ID")
    		
    		emailID.focus()
    		
    		return false
    	
    	}
    	
    	if(echeck(emailID.value) == false) {
    		
    		emailID.value = ""
    		
    		emailID.focus()
    		
    		return false
    	
    	}
    	
    	return true
     
    }
    
    
    </script>
    
    
    <form name = "frmSample" action = "https://www.pipelinedeals.com/web_lead" onsubmit = "return validateForm();" method = "post">
    
    <input type = "hidden" name = "w2lid" value = "removed for privacy" />
    <input type = "hidden" name = "thank_you_page" value = "http://www.fatsfixedassettracking.com/thanks.html"/>
    	
    <p>Enter email address:
    <input type = "text" name = "txtEmail">
    </p>
    
    <p><input type = "submit" name = "Submit" value = "Submit"></p>
    </form>
    </head>
    </html>

  • #2
    Well, you killed yourself right here:
    Code:
    	[B][COLOR="Red"]Var[/COLOR][/B] emailID = document.frmSample.txtEmail
    That gives you a javascript error and *NO CODE* past that point executes.

    JavaScript is case sensitive. The keyword is var and *not* Var.

    Aside from that, your email test is ugly and antiquated. Hang on...
    Be yourself. No one else is as qualified.

    Comment


    • #3
      And your HTML is illegal: You can't put a <form> into the <head> of a page. It must go in the <body>.
      Be yourself. No one else is as qualified.

      Comment


      • #4
        I was definitely thrown in the deep end on this. I am an intern and my boss already knows how to do it but he told me to just google, find forums, etc to figure out how to get it to work so I can learn. On top of it, I never learned Javascript before yesterday.

        So I need to close </head> after the </script> and then start <body>?

        Thanks so far Pedant.

        Comment


        • #5
          Remember I said the Var was the stopping point?

          Nope. You were calling onsubmit = "return validateForm();" but your function was named ValidateForm.

          Upper/lower mismatch. So you weren't even *getting* to the function.

          I almost missed that one.

          Code:
          <html>
          <head>
          <script type="text/javascript">
          function echeck(str) 
          {
              var emRE = /^[a-z][\w\-\'\.]*[\w\-\']\@([a-z][\w\-\']*\.)+[a-z]{2,6}$/i;
              str = str.replace( /^\s+/, "" ).replace( /\s+$/, "" ); // strip off spaces
              // then let the regular expression do its work
              return emRE.test( str );
          }
          
          
          function validateForm() 
          {
          	var emailField = document.frmSample.txtEmail;
                  if ( ! echeck(emailField.value) )
                  {
                        emailField.focus();
                        alert("Please enter a valid email address");
                        return false;
                  }
          	return true;
          }
          </script>
          </head>
          <body>
          <form name="frmSample" action="https://www.pipelinedeals.com/web_lead" 
                onsubmit="return validateForm();" method="post">
          
          <input type = "hidden" name = "w2lid" value = "removed for privacy" />
          <input type = "hidden" name = "thank_you_page" value = "http://www.fatsfixedassettracking.com/thanks.html"/>
          	
          <p>Enter email address: <input type="text" name="txtEmail"/></p>
          <p><input type="submit" name="Submit" value="Submit"/></p>
          </form>
          </body>
          </html>
          language="JavaScript" is far far out of date. Use type="text/javascript" as shown.
          Last edited by Old Pedant; Aug 30, 2011, 04:57 PM.
          Be yourself. No one else is as qualified.

          Comment


          • #6
            Still no alert is coming up and it is still posting no matter what I put as the email address. Even posts when I leave the field blank. I am using this code now:

            Code:
            <html>
            <head>
            <script type="text/javascript">
            
            function echeck(str) {
            	var emRE = /^[a-z][\w\-\'\.]*[\w\-\']\@([a-z][\w\-\']*\.)+[a-z]{2,6}$/i;
            	str = str.replace( /^\s+/, "" ).replace( /\s+$/, "" );
            	return emRE.test(str);
            }
            
            function ValidateForm() {
            	var emailField = document.frmSample.txtEmail;
                    if(!echeck(emailField.value)) {
                          emailField.focus();
                          alert("Please enter a valid email address");
                          return false;
                    }
            	return true;
            }
            
            </script>
            </head>
            
            <body>
            <form name = "frmSample" action = "https://www.pipelinedeals.com/web_lead" onsubmit = "return validateForm();" method = "post">
            
            <input type = "hidden" name = "w2lid" value = "private" />
            <input type = "hidden" name = "thank_you_page" value = "http://www.fatsfixedassettracking.com/thanks.html"/>
            	
            <p>Enter email address: <input type = "text" name = "txtEmail"/></p>
            <p><input type = "submit" name = "Submit" value = "Submit"/></p>
            
            </form>
            </body>
            </html>
            How does it know what to do when validateform() returns False? Seems like it will do the same as when it returns True. Is there something with onSubmit that I am missing?

            Comment


            • #7
              I edited my post to change "ValidateForm" to "validateForm". Thought I did it quickly enough, but you must have caught me in the change.
              Be yourself. No one else is as qualified.

              Comment


              • #8
                When you code
                Code:
                         onsubmit = "return validateForm();"
                that says "return the value you got from calling validateForm as the flag to onsubmit to tell it whether to proceed with the submittal or not."

                So when you return false from the function, the return to onsubmit says "don't submit". Any non-false value says "go ahead." And an error of any kind is considered a non-false value.
                Be yourself. No one else is as qualified.

                Comment


                • #9
                  Still posting everytime after everything you said.

                  I even tried this:

                  Code:
                  <html>
                  <head>
                  <script type = "text/javascript">
                  function echeck(str) {
                  	var emRE = /^[a-z][\w\-\'\.]*[\w\-\']\@([a-z][\w\-\']*\.)+[a-z]{2,6}$/i;
                  	str = str.replace(/^\s+/, "" ).replace( /\s+$/, "" );
                  	return emRE.test(str);
                  }
                  
                  function validateForm() {
                  	var emailField = document.frmSample.txtEmail;
                  	return false;
                  }
                  
                  </script>
                  </head>
                  <body>
                  <form name = "frmSample" action = "https://www.pipelinedeals.com/web_lead" onsubmit = "return validateForm();" method = "post">
                  
                  <input type = "hidden" name = "w2lid" value = "private" />
                  <input type = "hidden" name = "thank_you_page" value = "http://www.fatsfixedassettracking.com/thanks.html"/>
                  	
                  <p>Enter email address: <input type = "text" name = "txtEmail"/></p>
                  <p><input type = "submit" name = "Submit" value = "Submit"/></p>
                  </form>
                  </body>
                  </html>
                  Something simple that does not do anything but return false but it still posts and takes me to the thank you page.

                  Comment

                  Working...
                  X
                  😀
                  🥰
                  🤢
                  😎
                  😡
                  👍
                  👎