The website i'm doing is made of a fullscreen slider, with 4 different panels.
The fourth panel contains a php contact form. When I submit the form, it reloads the page from the first slider, so the user can't see the results (message sent, or any error) which are in the fourth panel, with the form.
Is there any way I can make the submit button also redirect to the div containing the form ?
Here is the basic markup, with the php script used :
<div id="container">
<div id="div1">
<div class="content">...</div>
</div>
<div id="div2">
<div class="content">...</div>
</div>
<div id="div3">
<div class="content">...</div>
</div>
<div id="div4">
<div class="content">
<form method="post" action="index.php">
<label>Nom</label>
<input class="small" name="name" placeholder="Name">
<label>Email</label>
<input class="small" name="email" type="email" placeholder="Email">
<label>Message</label>
<textarea class="small" name="message" placeholder="Message"></textarea>
<label>What's the best burger ever (antispam)</label>
<input class="small" name="human" placeholder="type the right answer">
<input id="submit" name="submit" type="submit" value="send">
</form>
<?php
$name = $_POST['name'];
$email = $_POST['email'];
$message = $_POST['message'];
$from = 'From: ...';
$to = 'johndoe@gmail.com';
$subject = 'New message';
$human = $_POST['human'];
$body = "From: $name
E-Mail: $email
Message:
$message";
if ($_POST['submit']) {
if ($name != '' && $email != '') {
if ($human == 'bacon burger') {
if (mail ($to, $subject, $body, $from)) {
echo '<div class="alert green"><p>Message sent!</p></div>';
} else {
echo '<div class="alert red"><p>An error occured. Go back and try again.</p></div>';
}
} else if ($_POST['submit'] && $human != 'bacon burger') {
echo '<div class="alert red"><p>You answered wrong to the antispam question.</p></div>';
}
} else {
echo '<div class="alert red"><p>You have to fill in all fields !</p></div>';
}
}
?>
</div>
</div>
</div>