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; }); 

demo no error

demo with error


Comments

Popular posts from this blog

linux - Mailx and Gmail nss config dir -

c# - Is it possible to remove an existing registration from Autofac container builder? -

php - Mysql PK and FK char(36) vs int(10) -