http://test.ericfinlayartist.co.uk/index.php
There's a contact area, which fully works, (thanks to help from 'CharlesEF').
The only thing is, if you click on 'Submit', the page reloads and scrolls back to the top, preventing you from seeing any confirmation or otherwise.
The closest I've come to seeing any relevant help involves an sql database, which throws me even more as I don't need a database!!!
The [working] form page code:
CODE
<form action="index.php" method="POST" id="myform">
<input name="email" type="email" placeholder="Email..." value="<?php if(isset($_POST["email"])) echo($_POST["email"]);?>"><br>
<span style="background: yellow; color: red;"><?php if(isset($errors["email"])) echo($errors["email"]);?></span><br>
<textarea placeholder="Message..." name="message" value="<?php if(isset($_POST["message"])) echo($_POST["message"]);?>"></textarea><br>
<span style="background: yellow; color: red;"><?php if(isset($errors["message"])) echo($errors["message"]);?></span><br>
<input type="submit" name="submit" value="Send" class="sub-btn">
</form>
<input name="email" type="email" placeholder="Email..." value="<?php if(isset($_POST["email"])) echo($_POST["email"]);?>"><br>
<span style="background: yellow; color: red;"><?php if(isset($errors["email"])) echo($errors["email"]);?></span><br>
<textarea placeholder="Message..." name="message" value="<?php if(isset($_POST["message"])) echo($_POST["message"]);?>"></textarea><br>
<span style="background: yellow; color: red;"><?php if(isset($errors["message"])) echo($errors["message"]);?></span><br>
<input type="submit" name="submit" value="Send" class="sub-btn">
</form>
and the javascript code, which I've placed just below where all the '<script>' tags are:
CODE
<script type="text/javascript">
$(document).on('submit', '#myForm', function(e) {
$.ajax({
url: 'index.php',
type: 'post',
data: $(this).serialize(),
success: function(html) {
alert('Form submitted');
$('#myForm').hide();
}
});
e.preventDefault();
});
</script>
$(document).on('submit', '#myForm', function(e) {
$.ajax({
url: 'index.php',
type: 'post',
data: $(this).serialize(),
success: function(html) {
alert('Form submitted');
$('#myForm').hide();
}
});
e.preventDefault();
});
</script>
The php code that sends the mail is contained in a separate file, which is 'included' at the tope of the index.php file.
Firstly, is the placing of the javascript code in the correct position?
I've placed it also just above the <form> and just below the <form> tags. But if the code is incorrect I guess it doesn't matter!
Apart from very basic javascript/jquery, I'm not conversant with javascript/ajax.
Can someone shed some light as to how things should work?
Thanks.....