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 7 of 7
  1. #1
    New Coder
    Join Date
    Nov 2011
    Posts
    28
    Thanks
    4
    Thanked 0 Times in 0 Posts

    Form submitting with JavaScript verification problem

    Hello,

    I want to validate form fields with JavaScript. This is easy - I can just take some standard scripts off the net that do this.

    The problem is that my form keeps submitting even when verification is needed.

    So for example, if I leave the name field empty and press submit, it will bring up the alert box saying to enter a name then it will submit a record to the database anyway.

    Then the customer fills in the details correctly and submits properly so there are 2 entries.

    I have tried putting the verification function in the submit button and the form tag as an onClick but it doesn't work.

    The form tag is:

    Code:
    <form name="theForm" method="post" action="Register" id="Register">
    Basically the 'action' above activates when submit is clicked even when there is verification needed.

    What can be done about this?

    Thanks.

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,863
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    What can be done about this?
    We need to see the full markup of your form and the javascript code involved.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #3
    New Coder
    Join Date
    Nov 2011
    Posts
    28
    Thanks
    4
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by abduraooft View Post
    We need to see the full markup of your form and the javascript code involved.
    The code is long. Good luck.

    Here's the submit button.

    <button type="submit" id="mygrey" class="registeruserButton" onclick="regSubmit()">Register</button>


    Here's the JavaScript.


    Code:
    function regSubmit()
     {   
      if(validateFields())
      {
      if(formObj.receiveEmailSub.checked)
      formObj.receiveEmail.value = true ;
      else
      formObj.receiveEmail.value = false ;
     
     //setting preferred currency
     if (document.RegisterForm.country[document.RegisterForm.country.selectedIndex].value == "IE") {
     	document.RegisterForm.preferredCurrency.value = "EUR";
     } else {
     	document.RegisterForm.preferredCurrency.value = "GBP";
     }
     
     //setting popup
     if (document.RegisterForm.country[document.RegisterForm.country.selectedIndex].value != "GB" && document.RegisterForm.country[document.RegisterForm.country.selectedIndex].value != "IE") {
     	document.RegisterForm.showPopup.value = "Y";
     } else {
     	document.RegisterForm.showPopup.value = "";
     }
     
     //setting logonid to lowercase
     document.RegisterForm.logonId.value = document.RegisterForm.logonIdnew.value.toLowerCase() + "#<c:out value="${WCParam.storeId}"/>";
     
      document.RegisterForm.submit();
      }
      else
      return false
      
      document.getElementById('mygrey').disabled = 'disabled';
      
    } 
    
    //Validate all the fields before submitting
    
    function validateFields() 
    {
        formObj=document.RegisterForm;
        return validateFirstName();
    }
    
    function validateFirstName() {
        // validate first name
        var str = formObj.firstName.value;
        if (str.length < 1 || str <="                   ") {
          alert("Please enter your First Name");
          formObj.firstName.focus();
          return false;}
        if (!checkAlpha(formObj.firstName)) {
          alert("First Name must not contain digits");
          return false; }
        return validateLastName();
      }
    
     function validateLastName() {
        // validate last name
        var str = formObj.lastName.value;
        if (str.length < 1 || str <="                   ") {
          alert("Please enter your Last Name");
          formObj.lastName.focus();
          return false;}
        if (!checkAlpha(formObj.lastName)) {
          alert("Last Name must not contain digits");
          return false; }
        return validateEmail();
      }
      
      function validateEmail()   {
        //validate email
        var str = formObj.email1.value;
        if (str.indexOf ('@',0) == -1 || str.indexOf ('.',0) == -1) {
          alert("\nPlease enter a valid e-mail address.")
          formObj.email1.focus();
          return false; }
          return spaceyemail();
    }
    
     function spaceyemail(){
    
        var str = formObj.email1.value;
         if(str.indexOf(' ',0) != -1){
          alert("\nE-mail address cannot contain a 'space'.")
          formObj.email1.focus();
          return false; }
         return alienemail();
    }
    
     function alienemail(){ 
        var str = formObj.email1.value;
        var pooh = "!£$%^&*()][><?;|,+{}#"; 
        for(i=0; i < str.length; i++){
        strChar = str.charAt(i);
         if (pooh.indexOf(strChar) != -1){
          alert("\nE-mail address contains an invalid character.")
          formObj.email1.focus();
          return false; }      
        }
         return confirmemail();
      }
    
      function confirmemail() {
         if(!formObj.logonIdnew.value) {
    	 alert('\nPlease confirm your email address');
             formObj.logonIdnew.focus();
    	 return false;
         }
         else if((formObj.email1.value) != (formObj.logonIdnew.value))
         {
    	alert('\nYour two email addresses do not match');
            formObj.logonIdnew.focus();
    	return false;
         }
       return changeEmailToLower();
      }
    	
    
      function changeEmailToLower(){
       formObj.email1.value = formObj.email1.value.toLowerCase();
       formObj.logonIdnew.value = formObj.logonIdnew.value.toLowerCase();
       return validatePassword();
      }
      
    
    function validatePassword() {
        // validate password
        var str = formObj.logonPassword.value;
        if (str.length < 1 || str <= "                   ") {
          alert("Please enter your Password");
          formObj.logonPassword.focus();
          return false;}
        return validateVerifyPassword();
      }
    
      function validateVerifyPassword() {
        // validate verify password
        var str = formObj.logonPasswordVerify.value;
        if (str.length < 1 || str <= "                   ") {
          alert("Please enter your Password Verification");
          formObj.logonPasswordVerify.focus();
          return false;}
        if (str != formObj.logonPasswordVerify.value) {
          alert("Password Verification does not match password");
          formObj.logonPasswordVerify.focus();
          return false;}
       	return validatePhone();
      }
     function validatePhone() {
        // validate phone
        var str = formObj.phone1.value;
        if (str.length < 1 || str <= "                   ") {
          alert("Please enter your Telephone Number including STD code.");
          formObj.phone1.focus();
          return false;}
        if (!checkNumeric(formObj.phone1))  {
          alert("Phone Number must only contain numbers and spaces");
          return false; }
        return validatePostcode();
      }
    
     
    
     function validatePostcode() {
        // validate post code
        var str = formObj.zipCode.value;
        if (str.length < 1 || str <="                    ") {
          alert("Please enter the Postcode for your address");
          formObj.zipCode.focus();
          return false;}
        return validatepostcodespace();
    }
    
     /*function validateCountry()   {
        // validate country field if UK not selected
        if (formObj.country.options[0].selected) {
          var str = formObj.country.value;
          if (str.length < 1 || str <="                    ") {
            alert("Please enter the Country for your address");
            formObj.country.focus();
            return false;}
        }
        return validatepostcodespace();
      }*/
    
    function validatepostcodespace() {
        var str = formObj.zipCode.value;
        if(formObj.country.value ==	'GB'){
        if (str.indexOf (' ',0) == -1){
          alert("\nYour Postcode should contain a space.");
          formObj.zipCode.focus();
          return false;}
        }
        return validateAddressLine1();
     }
    
     function validateAddressLine1() {
      
        // validate address line 1
    	if(document.getElementById('address1') == null){
    	alert("Please enter your full address either by using PostCode Lookup or enter address manually");
    	formObj.zipCode.focus();
    	return false;
    	}
        else{
        var str = formObj.address1.value;
        if (str.length < 1 || str <="                   ") {
          alert("Please enter your Street Address line 1");
          formObj.address1.focus();
          return false;}
        }
        return validateState();
      }
    
    function validateState() {
        // validate state=county
        if(document.getElementById('state') == null){
    	alert("Please enter your full address either by using PostCode Lookup or enter address manually");
    	formObj.zipCode.focus();
    	return false;
    	}
    	else{
        var str = formObj.state.value;
        if (str.length < 1 || str <="                   ") {
          	formObj.state.value = "-";
          return validateVAT();}
         }
        return validateVAT();
      }
      
      function validateVAT(){
      	 var str = formObj.taxPayerId.value;
      	 if(!(str.length < 1 || str <="                    "))
      	 {
      	 	if(checkStringforVAT(str.substring(0,2))) {
      	 		alert("Please verify VAT format. Click on Information(i) for more details");
      	 		formObj.taxPayerId.focus();
      	 	return false;}
      	 }
      	 	return validateAcceptTC();
      }
      
      function checkStringforVAT(value) {
    
    		var allowed = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
    		var allok = false;
    		for(var i=0;i < value.length;i++) {
    			if (allowed.indexOf(value.charAt(i)) == -1) {
    				allok = true;
    			}
    		}
    		return allok;
    	  }
      
       function validateAcceptTC() {
       if (!formObj.termconditions.checked) {
          alert("Please confirm that you accept our T&C");
          return false;}
          return true;
      }
      
    
    function checkOnlyUC(value) {
    
    	var allowed = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
    	var allok = true;
    	for(var i=0;i < value.length; ++i) {
    		if (allowed.indexOf(value.charAt(i)) == -1) {
    			allok = false;
    			break;
    		}
    	}
    	return allok;
    	} 
    
    function checkNumeric(field) {
        // check that field passed contains only digits & spaces
        var str = field.value;
        for (j=0; j < str.length; j++) {
          chr = str.substring(j, j+1);
          if (chr == " ") {  }
          else {
    	if (chr < "0" || chr > "9")  {
    	  field.focus();
              return false; }
          }
        }
        return true;
      }
    
      function checkAlpha(field) {
        // check if that field does not contain any numerics
        var str = field.value;
        for (j=0; j < str.length; j++) {
          chr = str.substring(j, j+1);
          if (chr >= "0" && chr <= "9")  {
    	field.focus();
            return false; }
        }
        return true;
      }


    Thanks

  • #4
    Senior Coder
    Join Date
    Jan 2011
    Location
    Missouri
    Posts
    4,438
    Thanks
    23
    Thanked 629 Times in 628 Posts
    To save time:
    Originally Posted by abduraooft View Post
    We need to see the full markup of your form and the javascript code involved.
    We want to see your form also.

  • #5
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,521
    Thanks
    3
    Thanked 507 Times in 494 Posts
    the call to the function regSubmit should be called from the form tag
    presuming the function return true if the validation is correct and false if not correct.

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    
    <head>
      <title></title>
    </head>
    
    <body>
    <form name="theForm" method="post" action="Register" id="Register" onsubmit="return regSubmit()">
    <button type="submit" id="mygrey" class="registeruserButton" >Register</button>
    </form>
    </body>
    
    </html>
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/

  • Users who have thanked vwphillips for this post:

    davidwhite (10-03-2012)

  • #6
    New Coder
    Join Date
    Nov 2011
    Posts
    28
    Thanks
    4
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by sunfighter View Post
    To save time:

    We want to see your form also.
    Can't.

    The text that you have entered is too long (36275 characters). Please shorten it to 20000 characters long.

  • #7
    New Coder
    Join Date
    Nov 2011
    Posts
    28
    Thanks
    4
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by vwphillips View Post
    the call to the function regSubmit should be called from the form tag
    presuming the function return true if the validation is correct and false if not correct.

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    
    <head>
      <title></title>
    </head>
    
    <body>
    <form name="theForm" method="post" action="Register" id="Register" onsubmit="return regSubmit()">
    <button type="submit" id="mygrey" class="registeruserButton" >Register</button>
    </form>
    </body>
    
    </html>
    I think you might be on to something vwphillips. This didn't work when I tried it before because I think I was stupid enough to use onclick in the form as well as the submit button when of course I should have used onsubmit in the form.

    Thanks


  •  

    Posting Permissions

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