Can anyone tell me why this bit of code isn't working?
<html> <head> <script src="http://code.jquery.com/jquery-1.9.1.js"></script> <script> $(function () { $('form').bind('submit', function () { $.ajax({ type: 'post', url: 'post.php', data: $('form').serialize(), success: function () { alert('form was submitted'); } }); return false; }); }); </script> </head> <body> <form> <input name="time" value="00:00:00.00"><br> <input name="date" value="0000-00-00"><br> <input name="submit" type="button" value="Submit"> </form> </body> </html>
When I push submit nothing happens. In the receiving php file I'm using $_POST['time'] and $_POST['date'] to put the data in a mysql query but it's just not getting the data. Any suggestions? I'm assuming it's something to do with the submit button but I can't figure it out
php', type: 'POST', data: { email: '[email protected]', message: 'hello world! ' }, success: function(msg) { alert('Email Sent'); } }); }); The form will submit in the background to the send_email. php page which will need to handle the request and send the email.
Sometimes, when a form is submitted, you don't want to reload the page, instead you want to execute a javascript function only. Here are ways of executing a javascript function on form submit without reload the html page. return false; is the key to prevent the from to reolad the html page.
Adding type="button" attribute to button solved my problem.
The form is submitting after the ajax request.
<html> <head> <script src="http://code.jquery.com/jquery-1.9.1.js"></script> <script> $(function () { $('form').on('submit', function (e) { e.preventDefault(); $.ajax({ type: 'post', url: 'post.php', data: $('form').serialize(), success: function () { alert('form was submitted'); } }); }); }); </script> </head> <body> <form> <input name="time" value="00:00:00.00"><br> <input name="date" value="0000-00-00"><br> <input name="submit" type="submit" value="Submit"> </form> </body> </html>
<html> <head> <script src="http://code.jquery.com/jquery-1.9.1.js"></script> <script> $(function () { $('form').bind('click', function (event) { // using this page stop being refreshing event.preventDefault(); $.ajax({ type: 'POST', url: 'post.php', data: $('form').serialize(), success: function () { alert('form was submitted'); } }); }); }); </script> </head> <body> <form> <input name="time" value="00:00:00.00"><br> <input name="date" value="0000-00-00"><br> <input name="submit" type="submit" value="Submit"> </form> </body> </html>
PHP
<?php if(isset($_POST["date"]) || isset($_POST["time"])) { $time=""; $date=""; if(isset($_POST['time'])){$time=$_POST['time']} if(isset($_POST['date'])){$date=$_POST['date']} echo $time."<br>"; echo $date; } ?>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With