Hello everyone,
I’m working to complete the form submission script that we were talking about over here. Now that my PHP script seems to somewhat in order, I need to decipher the proper jQuery code to add a success message into a div, with the i.d. of status. If the submission is not valid, the response from the PHP array should return a message inside the <p> element with an i.d. of errormessage.
What seems to be wrong here?:juggle:
$("#go").focus(function(){
if ($("#go").val() == $("#go").prop('defaultValue')){
$("#go").val('');
}
});
$("#go").on('focus blur', function(e) {
var v = $(this).val()
if (e.type == "focus"){
v = (v == "your e-mail")? "" : v;
} else {
v = (v == "")? "your e-mail" : v;
}
$(this).val(v);
});
//this is the function called by the success value of the first .ajax() call
function testFirstResults(response){
if (response.indexOf("Submission Successful") != -1){
$('<div>',{ id : 'blackoverlay' }).insertBefore('#submissionform');
$("#submissionform").css("display", "block");
} else if (response.indexOf("Invalid E-mail") != -1){
alert("Invalid mail");
} else if (response.indexOf("Nothing in Box") != -1){
//do nothing
} else {
//do nothing
}
}
function testSecondResults(response){
if (response['validation'] == "pass"){
$("#submissionform").css("display", "none");
$("#status p").html(response['message']);
$("#status").css("display", "block");
} else if (response['validation'] == "fail"){
if (response['message']){
}
}
}
$(document).ready(function(){
$("#emailbox").submit(function(e){
e.preventDefault();
$.ajax({
type: $(this).attr('method'),
dataType: 'html',
cache: false,
url: "Scripts/emailtester.php",
data: $(this).serialize(),
success: function(data){
testFirstResults(data);
}
});
});
$("#submissionform").submit(function(e){
var origEmail = $('#go').val();
var confirmEmail = $("#confirmemail").val();
var name = $("#name").val();
var age = $("#age").val();
var country = $("#country").val();
e.preventDefault();
$.ajax({
type: "POST",
dataType: 'json',
cache: false,
url: "Scripts/confirmform.php",
data: { origEmail: origEmail,
confirmEmail: confirmEmail,
name: name,
age: age,
country: country },
success: function(data){
testSecondResults(data);
}
});
});
});
confirmform.php
<?php
$instance = new CheckForm;
$instance -> checkSubmission();
class CheckForm
{
public function checkSubmission()
{
$response = array("validation" => " ", "message" => " ");
if ($_POST['country'] != "Select Country")
{
if (isset($_POST['confirmEmail']) && isset($_POST['name']))
{
$origEmail = $_POST['origEmail'];
$confirmEmail = $_POST['confirmEmail'];
if ($origEmail == $confirmEmail)
{
$name = htmlspecialchars($_POST['name']);
$ageRange = $_POST['age'];
$country = $_POST['country'];
require_once("categoryfinder.php");
$categoryFinder = new CategoryFinder;
$category = $categoryFinder -> getCategory();
require_once('databasewriter.php');
$dbWriter = new DatabaseWriter;
$dbWriter -> writeUserToDatabase($confirmEmail, $name, $ageRange, $country, $category);
$response = array("validation" => "pass", "message" => 'Thanks for joining the e-mail list, ' . $name . ', under the e-mail address, ' . $confirmEmail . '.');
} else {
$response = array("validation" => "fail", "message" => 'E-mail addresses don\\'t match.');
die();
}
} else {
if (!isset($_POST['confirmemail'])){
$response = array("validation" => "fail", "message" => 'Confirmation e-mail not entered.');
} elseif (!isset($_POST['name'])) {
$response = array("validation" => "fail", "message" => 'Please enter a name.');
}
}
} else {
$response = array("validation" => "fail", "message" => 'Please select a country.');
}
echo json_encode($response);
}
}
?>
form:
<div id="submissionform"> <!-- begin 2nd form markup -->
<form name="form2" method="post" action="Scripts/confirmform.php">
<div>
<label for="confirmemail" class="fixedwidth">Confirm your e-mail:<span>*</span></label>
<input type="text" name="confirmemail" id="confirmemail" value="" maxlength="60" class="inputwidth"/>
</div>
<div>
<label for="name" class="fixedwidth">Enter your name:<span>*</span></label>
<input type="text" name="name" id="name" value="" maxlength="60" class="inputwidth"/>
</div>
<div>
<label for="age" class="fixedwidth">Select your age range:</label>
<select name="age" id="age" class="inputwidth">
<option selected="selected">18–35</option>
<option>36–55</option>
<option>55+</option>
<option>17 or younger</option>
</select>
</div>
<div>
<label for="country" class="fixedwidth">Select your country:<span>*</span></label>
<select name="country" id="country" class="inputwidth">
<option selected="selected">Select Country</option>
<option>United States</option>
<option>United Kingdom</option>
<option>Canada</option>
<option>Australia</option>
<option>Russia</option>
<option>Brazil</option>
<option>Somewhere else</option>
</select>
</div>
<p id="errormessage"> </p>
<input type="submit" value="Sign Me Up!" class="formsubmitbutton" id="finalsubmit"/>
<input type="button" value="Cancel" class="formsubmitbutton" onclick="backToHomePage()"/>
</form>
</div>
</div>
There aren’t any errors that I’ve seen in the console of Firebug right now, but the page just sits there on submission.
Website: World Review Group