Ajax to submit form, and retrieve success/error - php

Question

I'm using jQuery with Ajax to submit a form to a PHP script.
The user will input their details, click a submit button, the PHP script will run and will have either performed the desired action or failed.
At this point I would want to display a success or error message based on the type of error.
<script>
$( "#contact-form" ).submit(function(event) {
event.preventDefault();
$.ajax({
url: "includes/contact-us.php",
type: "post",
data: $("#contact-form").serialize(),
success:function(data) {
alert(data);
},
error:function(){
alert("failure");
}
});
});
</script>
So in my jQuery above, when the form is submitted, it prevents the default action="path to script.php" then performs the submit. I've done this in case users have Javascript disabled, so at least the base functionality will be there.
PHP
<?php
if(isset($_POST['contact']) && !empty($_POST['contact'])){
$link = new mysqli("example", "example", "example", "example");
if($link->connect_errno > 0) {
die('Unable to connect to database [' . $link->connect_error . ']');
}
$name = $_POST['name'];
$email = $_POST['email'];
$website = $_POST['website'];
$subject = $_POST['subject'];
$message = $_POST['message'];
$stmt = $link->prepare("INSERT INTO contact (name, email, website, subject, message) VALUES (?, ?, ?, ?, ?)");
$stmt->bind_param("sssss", $name, $email, $website, $subject, $message);
if($stmt->execute()){
$rtn = "Success";
echo json_encode($rtn);
} else {
$rtn = "Failed";
echo json_encode($rtn);
}
$stmt->close();
$link->close();
}
However, in this example, an alert box appears empty. No errors in firebug or Apache logs.
Is it possible to: when I perform an submit using Ajax, I can recieve an echo "Text from error or success box"; which I can then put into a bootstrap alert?
The code I'm writing is new, so adapting to new libraries is something I would consider. This is purely for UI enhancement to show error or success messages, if the user has javascript disabled then the form default action wouldn't be prevented - they just wouldn't see a success or error message.
Something I have seen is "Javascript promises" I don't mind using Javascript if this is better in terms of useability, as I don't want to freeze the browser when a submit takes place.
Thanks for your time

Answer 1

Your code should look something like this
I would pass back a standard form of success/error from PHP. So failure might look like this:
json_encode(['success'=>false]);
Then acting on this in Javascript would look like this:
$.ajax({
url: "includes/contact-us.php",
type: "post",
data: $("#contact-form").serialize(),
success:function(data) {
data = JSON.parse(data);
if (data.success)
alert('success!');
else
alert('got failure response from PHP');
},
error:function(){
alert("failure");
}
});

Answer 2

You can use try catch() in php
<?php
// ...
try{
// your code
$msg = 'Success';
return json_encode($msg);
}catch(Exception $e){
$msg = 'Error';
return json_encode($msg);
}
?>