i have a web page with multi forms how can i submit any of this forms without reload or redirect the page? i don't need to get the response from the target page any way <form> <input type="text" name="text1" /> <input type="text" name="text2" /> <input type="text" name="text3" /> <input type="submit" name="submit1" /> <input type="submit" name="submit2" /> <input type="submit" name="submit3" /> </form> <form> <input type="text" name="text1" /> <input type="text" name="text2" /> <input type="text" name="text3" /> <input type="submit" name="submit1" /> <input type="submit" name="submit2" /> <input type="submit" name="submit3" /> </form> <form> <input type="text" name="text1" /> <input type="text" name="text2" /> <input type="text" name="text3" /> <input type="submit" name="submit1" /> <input type="submit" name="submit2" /> <input type="submit" name="submit3" /> </form> HTML:
Use jQuery and AJAX Submit A Form Without Page Refresh using jQuery This is all you need. Just change the formdata variable if you want to send a custom query string. <script type='text/javascript' src='jquery.min.js'></script> <script type="text/javascript"> $(document).ready( function () { $('form').submit( function () { var formdata = $(this).serialize(); $.ajax({ type: "POST", url: "submit.php", data: formdata, }); return false; }); }); </script> HTML:
You're welcome If you're not using a local copy of jQuery, change the first line to this: <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script> Code (markup): Also, take the comma off the end of this line data: formdata, My mistake Put the code in the head section, and change submit.php to the link where you send the form data. It will look something like this: <html> <head> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script> <script type="text/javascript"> $(document).ready( function () { $('form').submit( function () { var formdata = $(this).serialize(); $.ajax({ type: "POST", url: "http://www.example.com/submit.php", data: formdata }); return false; }); }); </script> </head> <body> <form> <input type="text" name="text1" /> <input type="text" name="text2" /> <input type="text" name="text3" /> <input type="submit" name="submit1" /> <input type="submit" name="submit2" /> <input type="submit" name="submit3" /> </form> </body> </html> HTML: