I want to set up a bootstrap success and error message on the website without having to link to another page. I also do not like the default “Please fill out this field”.
I don’t like it redirecting me to another page. So I would like to know how I can make it similar to the image above with a simple popup notification that the message was sent and error messages.
// redirect to success page
if ($success && $errorMSG == ""){
echo "Thank you for contacting Groupeezz! We will be with you shortlu";
}else{
if($errorMSG == ""){
echo "Something went wrong :(";
} else {
echo $errorMSG;
}
}
I tried adding something like this at the end of the php file but its not working.
if ($errorMSG) {
$result = '<div class="alert alert-danger" role="alert"><strong>Whoops, there was an error.</strong> Please correct the following: '.$errorMSG.'</div>';
} else {
mail("hello@example.com", "Contact Message", "Name: ".$_POST['name'],
"Email: ".$_POST['email'],
"Message: ".$_POST['message']);
{
$result = '<div class="alert alert-success" role="alert">Thank you for contacting Groupeezz! We will be in touch with you shortly!</div>';
}
}
Also I added the <?php echo $result; ?> so the error/success message can show up but its not showing up. It’s just blank and the email isn’t being sent either.
If you want to process and send the email without leaving the page, you’ll need to read up on Ajax - you use some JavaScript on the html code to capture the “send email” button press, which calls the php code in the background. The php code runs, sends the email, then returns a status message. Some more JavaScript then checks that response, and puts the success or failure message in the appropriate places on your original page.
Unless the user has disabled JavaScript, then you have to make sure it will still submit the page and deal with the return messages.
Is there another way to do it without the page redirect, anyone?
ETA - Sorry, I’ve just re-read and seen references to “Bootstrap”, I’m not sure what that is so my answer above may be irrelevant.
No your answer was very helpful! The ajax works and its not redirecting to a new page. I followed a tutorial I found like 2 years ago. I am not sure if that is outdated or not, but people are still using it even today.
But it works! =)
The bootstrap was some tutorial I found online that didn’t seem to work. I think Ajax did the trick. =)
Whilst the OP seems to have found a solution for the problem, you may wish to have a look at the Bootstrap page to get a feel for what it does. Whilst it may be slightly less popular than it once was, there’s still an awful lot of it out there, so it’s a handy thing to have a passing knowledge of.