Form validation not working

daniela · November 24, 2012, 7:58pm

Hi,

Hoping someone might be able to help me fix up my code…

My contact form has been validating the name, email and comments box successfully using javascript until I added a captcha code to my contact form today (copy and pasting the captcha code from another page of my site booknow.php). Now the form won’t validate and it just posts the form regardless of what values are inputted into the form. Thanks.

HTML


<form method="post"  onSubmit="return validateForm()" action="sendContact.php" id="contact" name="contact">
				<fieldset>
					<label for="name">Name:</label>
					<input type="text" value="Name" id="name" name="txtName" <?php if(!empty($errors)){ echo "value='".($name)."'"; } ?> />
					<label for="email">Email address:</label>
					<input type="text" value="Email address" id="email" name="txtEmail" <?php if(!empty($errors)){ echo "value='".($email)."'"; } ?> />
					<label for="enquiry">Your enquiry:</label>
					<textarea id="enquiry" value="Your enquiry" name="enquiry" />Your enquiry</textarea>

		<img src="captcha_code_file.php?rand=<?php echo rand(); ?>" id='captchaimg' ><br><br>

		<small>Can't read the image? click <a href='javascript: refreshCaptcha();'>here</a> to refresh</small><br><br>
<label for="input">Captcha code:</label>
		<input type="text" size="32" id="input" name="txtInput" <?php if(!empty($errors)){ echo "value='".($input)."'"; } ?> /><br><br>		

					<input type="image" alt="Submit" name="submit" id="submit" src="images/submit.jpg" />
				</fieldset>
			</form>

Javascript


    	<script type="text/javascript">
	
	function validateForm()

	{

		var errorMessage="";

		var name=document.forms["contact"]["txtName"].value;

		var email=document.forms["contact"]["txtEmail"].value;		

		var input=document.forms["contact"]["txtInput"].value;

		var atpos=email.indexOf("@");

		var dotpos=email.lastIndexOf(".");

		if (name==null || name=="")

		{

			errorMessage = "Your Name is required.\
";

		}

		
		if (email==null || email=="")

		{

			errorMessage += "Email address is required.\
";

		}

		else if (atpos<1 || dotpos<atpos+2 || dotpos+2>=email.length)

		{

			errorMessage += "Please enter a valid email address.\
";

		}
		

		if (input==null || input=="")

		{

			errorMessage += "Captcha code is required.\
";

		}

		
function refreshCaptcha()

	{

		var img = document.images['captchaimg'];

		img.src = img.src.substring(0,img.src.lastIndexOf("?"))+"?rand="+Math.random()*1000;

	}
	</script>

    <?php

    if(empty($_SESSION['6_letters_code'] ) || strcasecmp($_SESSION['6_letters_code'], $_POST['txtInput']) != 0)

	{

	//Note: the captcha code is compared case insensitively.

	//if you want case sensitive match, update the check above to

	// strcmp()

		$errors .= "The captcha code does not match";

	}
    ?>

SendContact.php


<?php
if ($_SERVER['REQUEST_METHOD']=='POST') {
$message = "Hi,

You have a new contact request.

From : ".$_POST['txtEmail']."
Name : ".$_POST['txtName']."
Message : ".$_POST['enquiry']."



Regards,
Daniela
Ready 2 Rock";

$headers = 'From: webmaster@ready2rock.com.au' . "\\r\
" .
    'Reply-To: webmaster@ready2rock.com.au' . "\\r\
" .
    'X-Mailer: PHP/' . phpversion();


    mail('daniela@ready2rock.com.au','Ready 2 Rock Contact Form',$message,$headers);
}
header('location:thankyou.html');

?>

James_Hibbard · November 24, 2012, 8:08pm

Hi,

You’re missing a curly brace to shut the validateForm function.
Does inserting that help?

daniela · November 24, 2012, 8:53pm

I’ve added the curley brace and when I did, dreamweaver said “no syntax errors”, I uploaded the new file to the server to test it, but it hasn’t fixed the problem.

James_Hibbard · November 24, 2012, 8:58pm

Shame.
What is it you are trying to do, exactly?
Are you trying to revert the form back to its original state, or are you trying to get it working with a captcha?

James_Hibbard · November 24, 2012, 9:03pm

Hi again,

I just had a look at the JavaScript (probably should have done that earlier :)), anyways, you’re not doing anything with the errorMessage variable, so the form will always submit.

You’re missing something like:

if (errorMessage !=""){
  alert(errorMessage);
  return false;
}

at the end of the validateForm function.

daniela · November 24, 2012, 9:12pm

Not sure I get what you mean. Something like the below…?


	function validateForm()

	{

		var errorMessage="";

		var name=document.forms["contact"]["txtName"].value;

		var email=document.forms["contact"]["txtEmail"].value;		

		var input=document.forms["contact"]["txtInput"].value;

		var atpos=email.indexOf("@");

		var dotpos=email.lastIndexOf(".");

		if (name==null || name=="")

		{

			errorMessage = "Your Name is required.\
";

		}

		
		if (email==null || email=="")

		{

			errorMessage += "Email address is required.\
";

		}

		else if (atpos<1 || dotpos<atpos+2 || dotpos+2>=email.length)

		{

			errorMessage += "Please enter a valid email address.\
";

		}
		

		if (input==null || input=="")

		{

			errorMessage += "Captcha code is required.\
";

	}
	
if (errorMessage !=""){
			errorMessage += "errorMessage".\
";
  return false;
}

	}

James_Hibbard · November 24, 2012, 9:14pm

Exactly, just copy and paste this:

function validateForm(){
  var errorMessage="";
  var name=document.forms["contact"]["txtName"].value;
  var email=document.forms["contact"]["txtEmail"].value;
  var input=document.forms["contact"]["txtInput"].value;
  var atpos=email.indexOf("@");
  var dotpos=email.lastIndexOf(".");
  if (name==null || name==""){
    errorMessage = "Your Name is required.\
";
  }

  if (email==null || email==""){
    errorMessage += "Email address is required.\
";
  } else if (atpos<1 || dotpos<atpos+2 || dotpos+2>=email.length){
    errorMessage += "Please enter a valid email address.\
";
  }

  if (input==null || input==""){
  errorMessage += "Captcha code is required.\
";
  }

  if (errorMessage !=""){
    alert(errorMessage);
    return false;
  }
}

daniela · November 24, 2012, 9:40pm

Excellent, that worked, thanks very much.

One other thing remains to fix, the catchpa code submits even if the wrong code is submitted, I have copy and pasted the following PHP code form the original page on which I have the catchpa code into the contact page head section , but it’s not working, any chance you would be able to help with this, or is it better to post this in another section of the forums?

PHP


        <?php 
    
    if(empty($_SESSION['6_letters_code'] ) || strcasecmp($_SESSION['6_letters_code'], $_POST['txtInput']) != 0)

	{

	//Note: the captcha code is compared case insensitively.

	//if you want case sensitive match, update the check above to

	// strcmp()

		$errors .= "The captcha code does not match";

	}
    ?>

daniela · November 24, 2012, 9:41pm

…could the same kind of function perhaps be done with Javascript?

James_Hibbard · November 24, 2012, 9:46pm

I’m always wary of form validation that relies solely on JavaScript, as you can get around it simply by turning JavaScript off.

Regarding the captcha code, this is being processed server side, right?
It’s probably better to start a new thread in the PHP forum about this.

daniela · November 24, 2012, 9:50pm

Ok no worries, thanks again for your help.