jQuery form.submit() refreshing page instead of submitting jQuery form.submit() refreshing page instead of submitting jquery jquery

jQuery form.submit() refreshing page instead of submitting


  1. You need to return false; or event.preventDefault(); from the submit function to prevent the default form action from happening.
  2. You should look into jQuery on with delegation so you don't have to rebind events when new elements are added to the DOM.


Add a return: false; to your submit function:

$("form.add_member").submit(function(){            //if input form isn't blank, create new li element with content of form, else go back to the add_member li            if($('form.add_member').val()) {                        $(this).replaceWith('<li><span class="vcard" title="Click to edit this members details"><span class="edit fn">'+$('input#fn_').val()+'</span></span><ul><li class="add_member">+</li></ul></li><li class="add_member">+</li>');                         addEditListeners();                        addAddListeners();                      } else {                        alert("no change");                    $(this).html("+");                    }                });            return false;            });


I think you need to return false; at the end of your .submit().