1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

Simple Form Verification Question

Discussion in 'JavaScript' started by Darkhodge, Feb 28, 2007.

  1. #1
    Hey,


    I have the following javascript in the body of my html file:

    And then call it to verify a form on submit. Here's a simplified version of the form:

    
    <form action="process.php" method="POST" onSubmit="var the_result=checkEmail();return the_result;" name = "regForm">
      <input type="password" name="pass"> 
      <input type="password" name="pass2"> 
      <input type="text" name="email"> 
      <input type="text" name="email2"> 
      <input type="submit">
    </form>
    
    HTML:
    The aim is to verify that the password and email have been entered correctly. However it still submits the form even if the passwords/emails are different...

    Where have I made a mistake? I'm a newbie to javascript so please forgive me if I made a stupid mistake! :eek:


    Thanks,

    Hodge
     
    Darkhodge, Feb 28, 2007 IP
  2. ajsa52

    ajsa52 Well-Known Member

    Messages:
    3,426
    Likes Received:
    125
    Best Answers:
    0
    Trophy Points:
    160
    #2
    Try this:

    On your javascript function where returning true:

    
    ...
    // If no errors found
    if (error_string == ""){
      var myForm = document.getElementById("regForm");
      myForm.submit();
      return true;
    }
    ....
    
    Code (markup):
    On your html:

    
    <form action="process.php" method="POST" id="regForm" name="regForm" onSubmit="checkEmail();">
    ....
    </form>  
    
    Code (markup):
     
    ajsa52, Feb 28, 2007 IP
  3. Darkhodge

    Darkhodge Well-Known Member

    Messages:
    2,111
    Likes Received:
    76
    Best Answers:
    1
    Trophy Points:
    185
    #3
    Heya,


    Thanks for your reply. I tried that but it still doesn't work... Here's the javascript now:

    
    	  <script type = "text/javascript">
    	  <!-- Hide from older browsers
    	  
    	  function checkEmail(){
    	    var error_string = "";
    	    
    	    var pass   = window.document.regForm.pass.value;
    	    var pass2  = window.document.regForm.pass2.value;
    	    var email  = window.document.regForm.email.value;
    	    var email2 = window.document.regForm.email2.value;
    	    
    	    alert (pass);
    	    alert (pass2);
    	    alert (email);
    	    alert (email2);
    	   
    	    // Check if passwords match
    		if (pass != pass2){
    			error_string += "  * Your Passwords Don't Match!\n";
    		}
    		// Check if email addresses match
    		if (email != email2){
    			error_string += "  * Your Email Addresses Don't Match!";
    		}
    		// If no errors found
    		if (error_string == ""){
    		    var myForm = document.getElementById("regForm");
                myForm.submit();
    			return true;
    		}
    		// Else errors found
    		else {
    			error_string = "We found the following errors:\n" + error_string;
    			alert (error_string);
    			return false;
    		}
    	  }
    	  
    	  // End hide -->
    	  </script>
    
    Code (markup):
    And the form in full this time:

    
    <form action="process.php" method="POST" id="regForm" name="regForm" onSubmit="checkEmail();">
      <table align="left" border="0" cellspacing="0" cellpadding="3">
        <tr>
    	  <td>
    	    Username:
    	  </td>
    	  <td>
    	    <input type="text" name="user" maxlength="30" value="<? echo $form->value("user"); ?>">
    	  </td>
    	  <td>
    	    <? echo $form->error("user"); ?>
    	  </td>
        </tr>
        <tr>
    	  <td>
    	    Password:
    	  </td>
    	  <td>
    	    <input type="password" name="pass" maxlength="30" value="<? echo $form->value("pass"); ?>">
    	  </td>
    	  <td>
    	    <? echo $form->error("pass"); ?>
    	  </td>
        </tr>
        <tr>
    	  <td>
    	    Confirm Password:
    	  </td>
    	  <td>
    	    <input type="password" name="pass2" maxlength="30">
    	  </td>
    	  <td>
    	    <? echo $form->error("pass"); ?>
    	  </td>
        </tr>
        <tr>
    	  <td>
    	    Email:
    	  </td>
    	  <td>
    	    <input type="text" name="email" maxlength="50" value="<? echo $form->value("email"); ?>">
    	  </td>
    	  <td>
    	    <? echo $form->error("email"); ?>
    	  </td>
    	</tr>
    	<tr>
    	  <td>
    	    Confirm Email:
    	  </td>
    	  <td>
    	    <input type="text" name="email2" maxlength="50">
    	  </td>
    	  <td>
    	    <? echo $form->error("email"); ?>
    	  </td>
    	</tr>
        <tr>
    	  <td colspan="2" align="right">
    	    <input type="hidden" name="subjoin" value="1">
            <input type="submit" value="Join!">
    	  </td>
    	</tr>
      </table>
    </form>
    
    Code (markup):
    What am I still doing wrong? :confused:
     
    Darkhodge, Feb 28, 2007 IP
  4. ajsa52

    ajsa52 Well-Known Member

    Messages:
    3,426
    Likes Received:
    125
    Best Answers:
    0
    Trophy Points:
    160
    #4
    Well, change this on your html (it's working for me):
    - Remove onSubmit from "form" tag
    - Replace last "input" with a "button"

    
    <form action="process.php" method="POST" id="regForm" name="regForm"> 
    ....
          <button type="button" onclick="checkEmail()">Join!</button>
    	  </td>
    	</tr>
      </table>
    </form>
    
    Code (markup):
     
    ajsa52, Feb 28, 2007 IP
    Darkhodge likes this.
  5. Darkhodge

    Darkhodge Well-Known Member

    Messages:
    2,111
    Likes Received:
    76
    Best Answers:
    1
    Trophy Points:
    185
    #5
    *EDIT* The javascript code was placed in a cell before. When I moved it out of the table it suddenly started working! Is this normal??? :eek:

    Oh well at least it works now :D

    Thanks!!! Rep added
     
    Darkhodge, Mar 1, 2007 IP
  6. ajsa52

    ajsa52 Well-Known Member

    Messages:
    3,426
    Likes Received:
    125
    Best Answers:
    0
    Trophy Points:
    160
    #6
    I usually put javascript code inside "head" tag. Maybe your original code was failing because of that
    .
     
    ajsa52, Mar 1, 2007 IP
  7. Darkhodge

    Darkhodge Well-Known Member

    Messages:
    2,111
    Likes Received:
    76
    Best Answers:
    1
    Trophy Points:
    185
    #7
    I'm using a template file and didn't want to put it in the head to try and reduce page size for the other pages.

    Not sure why it doesn't work when it's in a table but I've learned my lesson :)
     
    Darkhodge, Mar 1, 2007 IP
  8. joesgraphics

    joesgraphics Peon

    Messages:
    206
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    0
    #8
    Then why dont you put it in a .js file and include it in the page by useing

    <script language="javascript" type="text/javascript" src="javascript file name"></script>

    put that in ur head tags.
     
    joesgraphics, Mar 2, 2007 IP
  9. Darkhodge

    Darkhodge Well-Known Member

    Messages:
    2,111
    Likes Received:
    76
    Best Answers:
    1
    Trophy Points:
    185
    #9
    But then won't that be included across my whole site if I'm using a standard template for all my pages?

    Anyway I found out the problem by the way after about an hour of frustration. It was such a stupid mistake as well!!!!

    I was using PHP to print out the code and therefore the "\n" actually put the end of the error_message on a new line instead of including "\n" within the error_message. I just needed to escape that, i.e. "\\n" and it all worked fine :)
     
    Darkhodge, Mar 3, 2007 IP