Hi all,
Ok so I have setup my form and everything is working fine with AJAX. Form is posting to mysql fine and error messages are working before AJAX was implemented.
I have now implemented AJAX and the form still works but being new to PHP, jquery, mysql I cant figure out how to evolve my code to allow for the error messages to be passed back into the form through AJAX.
At the moment i only receive the "Thank's" msg that within my jquery code even when an error has occurred. I want this to be a variable and display the error if one occurs and if not then display my normal "Thank's" msg.
Here is what I have:
Code:
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Untitled Document</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("div#notif-me-msg-box").hide();
$("#form-submit").click(function() {
$.post('../bin/mdu-notif-form-2.php', {
'guest-email':$("#form-email").val()
},
function(response) {
$("div#notif-me-msg-box #notif-msg").html("Thank's. You will be notified when Multi Display Utility has launched");
$("div#notif-me-msg-box").slideUp().slideDown("normal");
}
);
return false;
});
$("div#notif-me-msg-box").click(function() {
$(this).slideUp("normal");
})
});
</script>
<style>
#notif-me-msg-box {
width:100%;
height:30px;
position: absolute;
top:0;
left:0;
cursor:pointer;
background-color:#CCC;
}
#notif-msg {
line-height:30px;
padding-left:10px;
}
</style>
</head>
<body>
<div id="notif-me-msg-box"><span id="notif-msg"></span></div>
<form id="notif-form">
<input id="form-email" autocomplete="on" placeholder="email" type="text" />
<input id="form-submit" type="submit" value="Submit" />
</form>
</body>
</html>
and here is my php file:
PHP Code:
<?php
define('DB_NAME', 'name');
define('DB_USER', 'user');
define('DB_PASSWORD', 'pass');
define('DB_HOST', 'localhost');
$link = mysql_connect(DB_HOST, DB_USER, DB_PASSWORD);
if (!$link) {
die('Could not connect: ' . mysql_error());
}
$db_selected = mysql_select_db(DB_NAME, $link);
if (!$db_selected) {
die('Can\'t use ' . DB_NAME . ': ' . mysql_error());
}
$value = $_POST['guest-email'];
//email validation
if (isset($value) == true && empty($value) == false) {
if (filter_var($value, FILTER_VALIDATE_EMAIL) == true) {
} else {
die('Enter a valid email!');
}
}
//empty email validation
if (empty($value)) {
die('Email required');
}
$sql = "INSERT INTO `mdu-notifier` (email) VALUES ('$value')";
if (!mysql_query($sql)) {
die('Error: ' . mysql_error());
}
mysql_close();
?>
So what do I need to add in both the php and html pages to get the error messages to appear within the html page using AJAX?
I have seen other tutorial using a lot more jquery but i find my version is easy to understand, can I keep this and still make it work or do i need all new AJAX implementation?
Thanks in advanced...
PS. i was looking on the jquery site and hought maybe that I have to use the .ajaxError() and ajaxSuccess() etc