New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

page reloads when route changed from form submission #1238

Closed
IgorMinar opened this Issue Aug 8, 2012 · 4 comments

Comments

Projects
None yet
2 participants
@IgorMinar
Member

IgorMinar commented Aug 8, 2012

Scenario:

  • app with routes
  • one route represents a view with a form
  • the form has a submit event handler (ng-click on submit button) that triggers $location change which causes $route change
  • when form is submitted, a full page reload occurs and the "preventDefault" request from the form directive is not honored.
@IgorMinar

This comment has been minimized.

Show comment
Hide comment
@IgorMinar

IgorMinar Aug 8, 2012

Member

it turns out that since the form directive uses jqLite/jQuery to register the submit event listener, this listener is removed when route change occurs and the dom (including the form) is destroyed before the event propagates to the form element.

once the event propagates to the form element, the submit listener is gone and the default is not prevented.

Member

IgorMinar commented Aug 8, 2012

it turns out that since the form directive uses jqLite/jQuery to register the submit event listener, this listener is removed when route change occurs and the dom (including the form) is destroyed before the event propagates to the form element.

once the event propagates to the form element, the submit listener is gone and the default is not prevented.

@IgorMinar

This comment has been minimized.

Show comment
Hide comment
@IgorMinar

IgorMinar Aug 8, 2012

Member

Vojta mentioned that a directive is affected by the same issue, so we should add a test and fix for that one too.

Member

IgorMinar commented Aug 8, 2012

Vojta mentioned that a directive is affected by the same issue, so we should add a test and fix for that one too.

@IgorMinar IgorMinar closed this in 054d40f Aug 10, 2012

IgorMinar added a commit that referenced this issue Aug 10, 2012

fix(form): prevent page reload when form destroyed
this fix ensures that we prevent the default action on form submission
(full page reload) even in cases when the form is being destroyed as
a result of the submit event handler (e.g. when route change is
triggered).

The fix is more complicated than I'd like it to be mainly because
we need to ensure that we don't create circular references between
js closures and dom elements via DOM event handlers that would then
result in a memory leak.

Also the differences between IE8, IE9 and normal browsers make testing
this ugly.

Closes #1238
@vlad

This comment has been minimized.

Show comment
Hide comment
@vlad

vlad Aug 11, 2012

Just in time! The page running my code based on the Project example with angular 1.0.1 would refresh about 1 in 3 times that the user was redirected via $location.path() even though there is no action attribute set on the form. I was able to do $("button").on("click", function() { return false; }) to prevent a page refresh (after failing to trap form submit). After building angular from HEAD, this work-around is no longer needed. Thanks for the great work!

vlad commented Aug 11, 2012

Just in time! The page running my code based on the Project example with angular 1.0.1 would refresh about 1 in 3 times that the user was redirected via $location.path() even though there is no action attribute set on the form. I was able to do $("button").on("click", function() { return false; }) to prevent a page refresh (after failing to trap form submit). After building angular from HEAD, this work-around is no longer needed. Thanks for the great work!

@IgorMinar

This comment has been minimized.

Show comment
Hide comment
@IgorMinar

IgorMinar Aug 11, 2012

Member

@vlad I'm glad that this fixes your issue

Member

IgorMinar commented Aug 11, 2012

@vlad I'm glad that this fixes your issue

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment