javascript - jQuery Submit Refreshing Page -
the following code intended purely ajax post request, instead seems post via ajax , browser navigates response.
the html...
<div id="bin"> <form class="add" method="post" action="/bin/add/"> <p>i'm interested! save later.</p> <input type="hidden" name="product_id" value="23423"> <input type="submit" value="save"> </form> <form style="display:none;" class="remove" method="post" action="/bin/remove/"> <p>i changed mind--i'm not interested.</p> <input type="hidden" name="product_id" value="23423"> <input type="submit" value="unsave"> </form> </div>
the jquery...
$('#bin form').submit(function() { $.post($(this).attr('action'),{ success: function(data) { $(this).hide().siblings('form').show() }, data: $(this).serialize() }); return false; })
as far understand it, return false;
line should mean no matter what, calls submit function or clicks on 'submit' button or hitting of enter means function execute , browser not navigate /bin/add
or /bin/remove
. reason, browser is changing pages.
any idea i'm doing wrong here? thanks.
my bet it's because of $(this)
, try way....
$('#bin form').submit(function() { var $this = $(this); $.post($this.attr('action'), { success: function(data) { $this.hide().siblings('form').show() }, data: $this.serialize() }); return false; });
Comments
Post a Comment