jquery - Page still refreshes with ajax -
html:
<body> <form name='sample' id='sample' method='get' action='followedbutton.php'> name:<input type='text' name='username' id='username'><br> age:<input type='text' name='userage' id='userage'><br> date:<input type='text' name='userdate' id='userdate'><br> <input type='submit' name='submit' id='submit' value='go!'> </form> </body>
js :
<script> $(document).ready(function () { var $form = $('#sample'); $form.submit(function (e) { $.get(url: $(form).attr('action'), data: $(form).serialize(), success: function (result) { $('#div').html(result) }, 'json'); return false; e.preventdefault(); }); }); </script>
php success page:
<?php error_reporting(e_all); ini_set('display_errors', 1); mysqli_report(mysqli_report_error | mysqli_report_strict); $conn = mysqli_connect('localhost', 'root', '') or die ("no mysqli"); mysqli_select_db($conn, 'sample') or die ("no db"); $name = $_get['username']; $age = $_get['userage']; $date = $_get['userdate']; $insert = ("insert `test` (name, age, date) values ('$name','$age','$date')"); $insert_query = mysqli_query($conn, $insert) or die ("no query"); mysqli_close($conn); //header('location:followbutton.php'); echo "<script text='javascript'>alert('ajax');</script>" ?>
so i'm trying submit form without refreshing page. when submit form, alert immediately, without page refresh. in chrome tab can see page still loading, , (after 5-7 secs or so) page goes followedbutton.php
.
how can prevent page refreshing while still having info go followedbutton.php
? in js code needs changed? works, don't want page refresh @ all.
i've taken advice other users on who've asked similar questions yet none of advice working me.
i've taken advice on post change code :
<script> $(document).ready(function(){ var $form = $('#sample'); $form.submit(function(e){ e.preventdefault(); $.get( url:$(form).attr('action'), data:$(form).serialize(), success:function(result) {$('#div').html(result)},'json'); return false; }); }); </script>
but still same result unfortunately. , sadly i've yet learn how user js console debugging purposes. it's on list of things though.
there no such thing $.get
$.get
. case sensitive. result, code blowing prior preventing default behavior submitting. once fix that, find using get
wrong.
alway check js console, have told issue.
proper call get
:
$.get($(form).attr('action'), $(form).serialize(), function (result) { $('#div').html(result) }, 'json');
Comments
Post a Comment