Problem with js/jquery staying on same page
Hi,
I'm very new to programming and only need it occasionally in my work so my understanding is not in depth. I'm trying to submit a form inside a CMS page and dont want a new page to load after processing the php mail script. Instead I need to display a single line success message (not an alert pop up box) without reloading the page or going to a different page.
Here's the code I have and my understanding is that the event.preventDefault should allow to stay on same page and "
$( "#contactResponse" ).html(data);" should put the success message on the same page.
This is my div tag above the form which is supposed to receive the success message:
<div id="contactResponse"></div>
This is my form tag:
<form id="contactForm" name="contactForm" method="post" action="/myemail.php">
This is the script above my form and div tag:
<script>
$("#contactForm").submit(function(event)
{
event.preventDefault();
var $form = $( this ),
$submit = $form.find( 'button[type="submit"]' ),
email_value = $form.find( 'input[name="email"]' ).val(),
message_value = $form.find( 'input[name="question"]' ).val(),
url = $form.attr('action');
var posting = $.post( url, {
email: email_value,
question: message_value
});
posting.done(function( data )
{
$( "#contactResponse" ).html(data);
});
});
</script>
The email works but the php script is on the server, and it takes me to a different page.
Can soome one please give me some suggestions/advice.
Thanks