I think we only need to change the parent "div form" to a real <form ...> and use existing areYouSure, it is more consistent and no need to manually handle these events.

I've replaced the custom logic with the areYouSure jquery plugin. Apparently the input element needs an "name" tag to function properly.

There is still a bug though. If you click "cancel", the form is still marked as dirty. This leads to the warning on page leave.

There is still a bug though. If you click "cancel", the form is still marked as dirty. This leads to the warning on page leave.

No worry, I will fix it

So you are taking over the PR?

I've got 2 ideas:

• Remove dirty class once "cancel" is clicked. But this doesn't feel right.
• Update the text to the original once "cancel" is clicked.

So you are taking over the PR?

I will make some improvements in this PR, just a moment.

Does 74f80d4 work for you?

The idea is to use an "ignore-dirty" class (we already used it at other places)

Hmm, I can see an easier solution without playing with the "ignore-dirty" class, we could just check whether the form is hidden. Will try it to see whether it could make the code clearer.

Update: done in be12c62

Your changes are looking very decent.
Thank you very much for your input. And the fast response time as well.

Feel free to rebase and clean up the commit history.

Let me know, once you are ready.
Then I can remove the draft status.

Also thank you very much for the initial idea and work, it indeed helps end users. 👍

I think it is ready and will vote my approval.

Feel free to rebase and clean up the commit history.

(Oh by the way, no need to rebase or squash in a PR, the final merge (to main branch) will do a square merge to have a clear commit history 😄 )

Yeah, I wrote a really big issue and then refreshed. Aaaand pooooof, everything was gone. 😆

Need a follow up fix: Fix areYouSure confirm #32941