Does Not send form

Demeteor · 01-09-2013, 05:27 PM

Hello there. I want to send a form to the next one but it seems my javascript is interupting or something. can samome help me a bit here ??

here is my code the problem is , it does not redirect to the next page step2.php

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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <LINK href="mycss.css" rel="stylesheet" type="text/css">

<title>Home Page </title>
<?php
session_start();
?> 
<script>
	function formSubmit()
	{
	//Clears All the error messages. so they can be reprinted 
	//or show that evrything is correct
	 	var node = document.getElementById("wrongpass")
		node.innerHTML =""
	 	var node = document.getElementById("noname")
		node.innerHTML =""
    	var node = document.getElementById("nolastname")
		node.innerHTML =""
	//Xpass is a valitation variable where it INC when it sees a correct field
	//if its 3 it will accept the form and send the client to next page with 
	//The Login Information
		var xpass = 0 ; 
		
//The Following if satements wil check if the user added correct info in the form		
 	if  ( document.getElementById("pass").value == 5 )  
 		{
  			xpass = xpass +1 ; 
 		}
 	else
  		{ 
			document.getElementById("wrongpass").innerHTML = "Correct Password";
		 	document.getElementById("wrongpass").innerHTML = "You Have Entered A wrong <b>Password</b> (Its 5)";

		}

 	if  ( document.getElementById("lastname").value == "" )
	 	{
    	document.getElementById("nolastname").innerHTML = "You Did Not Enter A <b>Last Name</b>";
 		}
    else 
 		{
  			xpass = xpass +1 ;
 		}
 
    if  ( document.getElementById("firstname").value == "" ) 
		{
  		 document.getElementById("noname").innerHTML = "You Did Not Enter A Name";
   
 		}
   else 
 		{
  			xpass = xpass +1 ;
 		}
 
		if ( xpass == 3) {

		}

	else { 
    alert("Check The Info Given to you to know whats wrong"); 
	}

}


</script>

</head>

<body>
	<div id="page-wrap">
		<h1>Welcome Please Login </h1>
		<p id="wrongpass"></p> 
		<p id="noname"></p> 
		<p id="nolastname"></p> 

	<div id="contact-area">
	<form  action="step2.php" method="get" id="login" > 
		First name: <input type="text" class="contactform" name="fname" id="firstname"><br> 
		Last name: <input type="text" name="lname" id="lastname"><br>
		Password :  <input type="password" name="pass" id = "pass"  > <br><br>
		<input type="button" onclick="formSubmit()" value="Submit"> 
	</form>
	</div>
	</div> 

</body>
</html>

Logic Ali · 01-09-2013, 07:57 PM

Your code isn't preventing the submission of the form, because it isn't capable of doing that.

Nothing on that page instructs the form to submit.

You need <input type="submit">

You need to attach your function to the onsubmit event, and on error it must return false.

AndrewGSW · 01-09-2013, 08:03 PM

With the DOCTYPE you are using you should close certain tags with />

Code:

<link href="mycss.css" rel="stylesheet" type="text/css" />

This includes input tags, and <br> should be <br /> - or switch to HTML5

It is preferable to use a submit button, rather than an input-button:

Code:

<input type="submit" name="btnSubmit" id="btnSubmit" value="Submit" />

Your formSubmit() function should be called in the onsubmit event of the form, otherwise it will not be called if someone just presses Enter:

Code:

<form  action="step2.php" method="get" id="login" onsubmit="formSubmit();">

Your formSubmit() code needs to return false; if you wish to prevent the form-submission.

You should ideally test against '5' rather than the number 5, as form-values are strings:

Code:

if  ( document.getElementById("pass").value == '5' )

BTW I would prefer not to use the variable name 'node', but that's just me!

Demeteor · 01-10-2013, 12:55 PM

thanks both of you for the great help. I was wondering Why I had to insert that many else
in the code. I also forgot to do

Code:

  document.getElementById("login").submit()

so it will send the form to step2.php
now it sends it correctly. one more question

to check if the user entering step2.php and step3.php has entered the password correctly I need php right ? if so what is the way of doing it ? If you can help with this one it would be great

Logic Ali · 01-10-2013, 03:06 PM

Quote:

Originally Posted by Demeteor

I also forgot to do

Code:

  document.getElementById("login").submit()

That is something you MUST forget. Never call submit, use a submit-type button as you were told.