This is a weird issue, and I don't know if it's specifically related to ajax callback or not, but that's when I'm seeing it.

After the ajax callback returns, a message is displayed in situ, and clicking the "dismiss" button causes a page reload.
Clicking "dismiss" doesn't cause this behavior normally.

Best I can tell, the inlined Drupal behavior doesn't get re-attached after an ajax call is completed.

CommentFileSizeAuthor
#2 dismiss-preventDefault-2497177-2.patch928 bytesaaronbauman

Comments

aaronbauman’s picture

aaronbauman
he/him
commented
Status: Active » Closed (cannot reproduce)

Actually that doesn't make any sense, because if the behavior weren't attached the dismiss button would not appear.

I think this must be an application issue on my end.

aaronbauman’s picture

aaronbauman
he/him
commented
Status: Closed (cannot reproduce) » Needs review
StatusFileSize
new dismiss-preventDefault-2497177-2.patch928 bytes

OK, I see the problem:
The callback renders the message inside a <form> element.
Therefore, the <button> element used by dismiss causes a form submit.

Arguably a different element should be used, but at any rate the button should definitely not submit the form.

Attached patch adds a simple "preventDefault" to the click handler.

rupl’s picture

rupl
he/him
Primary language English
commented
Related issues: +#2083375: Close button is inaccessible

Hi there, thanks for this patch! I think preventing the event from bubbling is the best solution. I will remove the return false; from your patch since that creates other undesirable behavior but otherwise commit as is.

Regarding the <button> being inappropriate, please read #2083375: Close button is inaccessible to understand why that markup was chosen. It's the best option for accessibility.

  • rupl committed 26c5d18 on 7.x-1.x authored by aaronbauman 
    Issue #2497177 by aaronbauman: prevent event bubbling when Dismiss...
rupl’s picture

rupl
he/him
Primary language English
commented
Title: Causes a page reload when message is displayed after an ajax callback » Prevent event bubbling when Dismiss button is used
Status: Needs review » Fixed
rupl’s picture

rupl
he/him
Primary language English
commented

I created a new release containing this fix. Thanks for your contribution!

https://www.drupal.org/node/2510666

aaronbauman’s picture

aaronbauman
he/him
commented

OK great, thanks for the review and the background regarding button element.

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.