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

preventDefault not stopping propagation with remote link_to #163

Closed
MrHubble opened this Issue Jul 12, 2018 · 3 comments

Comments

Projects
None yet
2 participants
@MrHubble

MrHubble commented Jul 12, 2018

Problem

Within a stimulus controller action, event.preventDefault is not stopping the ajax request created with remote: true from a link_to element

Expected

I would expect event.preventDefault to stop the ajax request as I believe it does with button_to etc.

Sample code

# index.erb
<%= link_to 'New Article', new_article_path, remote: true, data: {action: "hello#testPreventDefault"} %>
//hello_controller.js
  testPreventDefault(event){
    event.preventDefault()
  }

Output

The logs show the new route is accessed even though event.preventDefault() is called:

screen shot 2018-07-12 at 7 25 59 pm

Sample repo

https://github.com/MrHubble/stimuluslinkto

@fourcube

This comment has been minimized.

fourcube commented Jul 12, 2018

event.preventDefault() only prevents the link from being followed. event.stopImmediatePropagation() will stop the event from being propagated to other event handlers.

@MrHubble

This comment has been minimized.

MrHubble commented Jul 12, 2018

@fourcube thanks for taking the time to help.

With event.stopImmediatePropagation() the request still went through but this time as HTML rather than JS:

screen shot 2018-07-12 at 9 27 09 pm

@MrHubble

This comment has been minimized.

MrHubble commented Jul 12, 2018

@fourcube I think I must have misunderstood your answer. When I use both preventDefault() and stopImmediatePropagation() together it works which is what I think you were referring to. So the solution is

  testPreventDefault(event){
    event.preventDefault()
    event.stopImmediatePropagation()
  }

Seems I have some reading to do. Thanks again.

@MrHubble MrHubble closed this Jul 12, 2018

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