PDA

View Full Version : AJAX form submission with JQuery



axm
01-21-2009, 08:36 PM
Hello all, I'm pretty much a JS n00b and require some assistance with my JQuery form submission. As you will see from my code I'm doing the validation with PHP and PHP will show an error message or a success message upon submission. I wish to avoid the page load so I thought I'd use some AJAX. Please see below for my code:

http://clients.abstractx.co.uk/atom


<?php
if($added == "1") { echo "<h3>Thank you for subscribing!</h3>"; }
else if($deleted == "1") { echo "<h3> " . $email . " Unsubscribed successfully</h3>"; }
else if($error == "1") { echo "<h3>E&ndash;Mail address invalid</h3>"; }
else if($notfound == "1") { echo "<h3>Sorry, E&ndash;Mail address not found</h3>"; }
else if($error == "2") { echo "<h3>You've already subscribed!</h3>"; }
else { echo "<h3>Simply enter your e&ndash;mail address below:</h3>"; }
?>
<form id="emailform" action="add.php" method="post">
<fieldset>
<div><label>E&ndash;Mail</label></div><div><input id="email" type="text" name="email" class="text_box" /></div><div><input id="subscribe" type="submit" class="submit" name="subscribe" value="Subscribe" /></div><div><input id="unsubscribe" type="submit" class="submit" name="subscribe" value="Un-Subscribe" /></div>
</fieldset>
</form>


$(document).ready(function(){
$("form#emailform").submit(function() {

// we want to store the values from the form input box, then send via ajax below
var email = $('#email').attr('value');

$.ajax({
type: "POST",
url: "add.php",
data: "email=" + email,
success: {
}
});
return false;
});
});

If you need to see my PHP then let me know.

Many thanks for your help!

bgallegos
01-23-2009, 04:44 PM
So what exactly is the problem that you are running into?