I have been developing a pretty simple mailer form in PHP. I have each of the questions in div elements and this javascript reveals the next div/question (it is in the file form.php)
<script type="text/javascript">
function hideshow(which){
if (!document.getElementById)
return if (which.style.display=="block")
which.style.display="none"
else which.style.display="block" }
</script>
and a separate code validates what was selected or inputted before revealing the next element.
Okay, so everything works just fine on the index page. However, on the contact us page (where I want the form available since I suspect many people will not fill out the popup on the index page) I have hit a snag. My script advances all the way to the final question and the button to submit the form. Then nothing happens... I can click the button but it does not submit the form. Here is the script that should submit the form (included in validation.js):
function ageValidate(){ 'use strict';
//Verfiy that submitter is not a robot
var age=document.getElementById('age').value;
if(age === ""){ // no answer, submit form
document.getElementById('ageErr').innerHTML = 'This is to validate that you are not a robot, please enter the correct answer to the problem.';
return false;
} else if (age === "5"){ // right answer
submitForm(); return true; } else { // wrong answer
document.getElementById('ageErr').innerHTML = 'Your answer is incorrect or you did not use the numeric format. 2 is valid, but two is not valid.'; } }
$(document).ready(function() { $(window).keydown(function(event){
if(event.keyCode == 13) {
event.preventDefault();
return false;
} }); });
function submitForm() { if (document.getElementsByName("serviceType")[0].value === "")
return false; else if (document.getElementsByName("numberPhones")[0].value === "")
return false; else if (document.getElementsByName("zip")[0].value === "")
return false; else if (document.getElementsByName("email")[0].value === "")
return false; else if (document.getElementsByName("name")[0].value === "")
return false; else if (document.getElementsByName("age")[0].value === "")
return false; else { document.forms["howHelp"].submit(); }
and the last question on the form in form.php:
<div id="q7" style="display:none">
<div class="how-help">
<h2>What is eight minus three?</h2>
<center><div>
<input type="text" name="age" id="age" value="<?php echo $age;?>">
</div><br/>
<div id="ageErr" name="ageErr" style="color: #000; background: #41b0cc; font-weight:700; width: 400px; height: auto; margin:0px; font-size:10pt;"></div></center>
</div>
<!-- FOOTER -->
<div class="how-help-footer">
<center>
<input type="button" class="jump"
value="Continue"
onclick="ageValidate()"></form>
</center><a href="javascript:hideshow(document.getElementById('q6')); hideshow(document.getElementById('q7'))" class="back">BACK</a><div class="private"><a href="#" class="private"> Privacy Policy</a></div>
</div>
</div>
<script src="validation.js" language="javascript" type="text/javascript"></script>
Again, it works perfectly fine on the index page but not the contact page... I should add that all of the files are in the same directory so there should not be any issue with pointing to the wrong directory. I use
php include 'form.php'
to have the form both places and I am not sure if this could be the issue, but my form action is:
$_SERVER['PHP_SELF'];
I should add that this is an amazing community of extremely helpful people and without the many questions asked and answered I would not be where I am with this project, so thanks for everything in the past and in advance!
