How to submit a form without refreshing the page?

Question

I do not know PHP.

I do not want the user to go to http://www.example.com/feedback-thanks.html after submitting the form. I want the text below the sent button or something without refreshing the page .

I deleted header( "Location: http://www.example.com/feedback-thanks.html" ); but I do not receive the email and the user is redirected to feedback.php ... :(

HTML

 <form method="post" action="feedback.php"> <input name="email" type="email"/> <textarea name="message" id="feedback-textarea" autofocus="autofocus" required="required" ></textarea> <button type="submit" id="feedback-button-send">send</button> </form> 

feedback.php

 <?php $email = $_REQUEST['email'] ; $message = $_REQUEST['message'] ; mail( " [e-mail] ", "Subject Here", $message, "From: $email" ); header( "Location: http://www.example.com/feedback-thanks.html" ); ?> 

Answer 1

You will need $.ajax() for this

• http://net.tutsplus.com/tutorials/javascript-ajax/5-ways-to-make-ajax-calls-with-jquery/
• http://www.sitepoint.com/ajax-jquery/

this is what i use in one of my applications

 $('#submitSearch').click(function() { var formData = { searchData: $('#searchData').val(), }; $.ajax({ url: siteUrl + 'fetch/search', type: "POST", data: formData, cache: true, beforeSend:function(){ jQuery('#main').html('<div class="loading"><img src="' + siteUrl + 'resources/imgs/ajax-loader.gif" alt="Loading..." /></div>'); }, success: function(data) { jQuery('#main').empty(); jQuery('#main').append(data); }, error:function(x,e){ if(x.status==0){ alert('You are offline!!\n Please Check Your Network.'); }else if(x.status==404){ alert('Requested URL not found.'); }else if(x.status==500){ alert('Internel Server Error.'); }else if(e=='parsererror'){ alert('Error.\nParsing JSON Request failed.'); }else if(e=='timeout'){ alert('Request Time out.'); }else { alert('Unknow Error.\n'+x.responseText); } } }); return false; }); 

Answer 2

I would suggest using a Javascript framework like jQuery and using its AJAX function. Lots of tutorials to find online if you google it.

Start with jquery.com

Answer 3

• posibility - use ajax in any form - jQuery, plain, etc. see google

• posibility - create a hidden iframe with name = "sender" and use the target attribute (I'm not sure if it is valid, but it works without javascript)

Answer 4

If you want me to just look at this tutorial (with a demo)

http://net.tutsplus.com/tutorials/javascript-ajax/submit-a-form-without-page-refresh-using-jquery/