HTML to JS to PHP to mySQL Problem///

Hi all,

I'm having some issues with getting a html form to send data through to my MYSQL database. JS is the one part of the script that I'm least sure about, so I assume the issue lies there...

All the data from the text fields in the form go through to the MySQL table fine, but the data from the drop down box and checkbox doesn't make it...

So, the html dropdown and checkbox code from the form is:



<label for="lettertype" id="lettertype_label">I want my letter to be: </label><br>
<select id="lettertype" name="lettertype">
<option value="0"></option>
<option value="public">Public, though Anonymous</option>
<option value="private">Private</option>
</select><br>
<label class="error" for="lettertype" id="lettertype_error">Would you like your letter to be public or private?</label> <br>

<label for="terms" id="terms_label">I understand thde terms and agreements...</label><br>
<input type="checkbox" name="terms" value="Yes" /><br>
<label class="error" for="terms" id="terms_error">We know no one ever reads these things, but we need to you at least pretend...</label>

When submit is clicked, it calls the following javascript:

$(function() {
$('.error').hide();
$('input.text-input').css({backgroundColor:"#F6F6F6"});
$('input.text-input').focus(function(){
});
$('input.text-input').blur(function(){
$(this).css({backgroundColor:"#F6F6F6"});
});

$(".button").click(function() {
// validate and process form
// first hide any error messages
$('.error').hide();

var letter = $("textarea#letter").val();
if (letter == "") {
$("label#letter_error").show();
$("textarea#letter").focus();
return false;
}

var firstname = $("input#firstname").val();
if (firstname == "") {
$("label#firstname_error").show();
$("input#firstname").focus();
return false;
}
var surname = $("input#surname").val();
if (surname == "") {
$("label#surname_error").show();
$("input#surname").focus();
return false;
}
var email = $("input#email").val();
if (email == "") {
$("label#email_error").show();
$("input#email").focus();
return false;
}

var lettertype = $("select#lettertype").val();
if (lettertype == "0") {
$("label#lettertype_error").show();
$("select#lettertype").focus();
return false;
}

var terms = $("input#terms").val();
if (terms == "") {
$("label#terms_error").show();
$("input#terms").focus();
return false;
}




var dataString = '&letter=' + letter + '&firstname='+ firstname + '&surname=' + surname + '&email=' + email + '&lettertype' + lettertype + '&terms' + terms;
//alert (dataString);return false;

$.ajax({
type: "POST",
url: "../php/emailform.php",
data: dataString,
success: function() {
$('#replace').html("<div id='message'></div>");
$('#message').html("<br>")
.append("")
.hide()
.fadeIn(1500, function() {
$('#message').append("<img id='mailconfirm' src='images/mailconfirm.png' /><br><br>");
});
}
});
return false;
});
});
runOnLoad(function(){
$("input#firstname").select().focus();
});


Then in terms of the PHP script, this is the excerpt:


$letter = $_POST['letter'];
$firstname = $_POST['firstname'];
$surname = $_POST['surname'];
$email = $_POST['email'];
$lettertype = $_POST['lettertype'];
$terms = $_POST['terms'];
$timestamp = date( 'Y-m-d');


$sql = "INSERT INTO ToBeEmailed (letter, firstname, surname, email, lettertype, terms, timestamp) VALUES ('$letter', '$firstname', '$surname', '$email', '$lettertype', '$terms', '$timestamp')";




If anyone could offer any advice that'd be great! Cheers in advance...:)

There hare 3 errors in your jquery javascript:

1)In this line of code:
var dataString = '&letter=' + letter + '&firstname='+ firstname + '&surname=' + surname + '&email=' + email + '&lettertype' + lettertype + '&terms' + terms;
you missed some '=' . Must be:

var dataString = '&letter=' + letter + '&firstname='+ firstname + '&surname=' + surname + '&email=' + email + '&lettertype=' + lettertype + '&terms=' + terms;


2) For the checkbox if you want to use this selector
$("input#terms") than in the html part you need to use the id="terms" for checkbox.
Then, this:
<input type="checkbox" name="terms" value="Yes" />
Becomes:
<input type="checkbox" id="terms" name="terms" value="Yes" />

3)To control if chekbox is checked is necessary to replace this lines of code:
var terms = $("input#terms").val();
if (terms == "") {
$("label#terms_error").show();
$("input#terms").focus();
return false;
}
With:

var terms="";
if($("input#terms").is(":checked")){
terms = $("input#terms").val();
}
if (terms == "") {
$("label#terms_error").show();
$("input#terms").focus();
return false;
}




Elsewhere terms is always Yes.

I think the rest of your code is correct but I'm not 100% sure.

Bye
Antonio

You are an absolute superstar! Thank you so much indeed! :thumbsup:

Hello, sorry me again.... I have a quick follow up question...

At the end of the script, I need a redirect to happen. What I'm after is: If they've selected either "Australia" or "New Zealand" it goes to one page, if it's any other country, it goes to another.

The code I have is:

if (countryp == "Australia" || "New Zealand"){

$.ajax({
type: "POST",
url: "../php/postform.php",
data: dataString,
success: function() {
window.location = "WEBSITE1.COM"
}
});
}

else {
$.ajax({
type: "POST",
url: "../php/postform.php",
data: dataString,
success: function() {
window.location = "WEBSITE2.COM"
}
});
}


I assume there's something wrong with the first line of code... Originally, I only had one variable in the if statement: "Australia". Now that I've added New Zealand in, it does some strange things....

Again, any help would be really appreciated!

Cheers