In #1452188: New UI for string translation we copied some parts of tabledrag warning to the string translation ui, to show the user that he changed something and needs to save this. We would also like to have some dirty forms functionalities which warns the user of leaving the page without saving changes.

The idea would be to have a general JS functionality which can be easily used by core and contrib to inform users about changes (moving the current tabledrag into more general).
Or even better to have a dirtyform (but this would be probably way harder).

There is a DirtyForms implementation for D6: http://drupal.org/project/dirtyforms
And a project application for D7: #1503176: jQuery Dirty Forms which uses the JQuery DirtyForms Plugin http://mal.co.nz/code/jquery-dirty-forms/

Support from Acquia helps fund testing for Drupal Acquia logo

Comments

mgifford’s picture

Tagging

nod_’s picture

Component: other » forms system
Issue tags: -Needs accessibility review

That's a nice idea. I read the code for dirty form plugin. Let's just keep the idea, the code is not up to core standards and has too much things in it we won't be using.

nod_’s picture

sorry about that

nod_’s picture

There is two issue here really:

1) Detect a form has changed values (checking against default value, or stored initial values – can be tricky for FF).
2) Display an alert, stop the user from hurting himself.

And I really mean to separate the two, as shown by #1637404: Improve Drupal.behaviors.formUpdated, there is a need for contrib to access this information programatically.

Wim Leers’s picture

To add to #4.1: it might make sense to also support jQuery('[content-editable]'). There, it would need to bind to blur keyup paste (and of course: compare with the original values to make sure something has actually changed).

Wim Leers’s picture

Title: General "changed" warning messages / dirty forms » form.js' formUpdated event is unreliable/incomplete
Category: feature » bug

Another bug report due to formUpdated being sucky: #2099331: Save button does not appear when using quick edit to remove an image from a post. I.e. when using the file render element, clicking the AJAXy "Remove" button should trigger formUpdated, but it does not.

Attempting to improve the issue title. Feel free to improve further.

Wim Leers’s picture

The exact same bug was reported again, and it's still formUpdated being crappy that's at fault.

This sorely lacking feature leads to critical UI problems. Bumping to critical.

Bojhan’s picture

I agree, this is pretty horrible. Every field should by default work within Edit module.

nod_’s picture

Status: Active » Needs review
FileSize
18.68 KB

May be a bit too much going on in this patch:

Fix formUpdated, should work properly and much less often than before. Can't test the remove image in edit since the whole functionality is busted. It triggers as expected when using the backend though.

The JS clean-up done on the active class issue is needed here as well to remove a couple of ugly lines.

Added as a bonus, the file validation in JS is fixed (yes, it was broken).

I don't think this works on unmanaged file inputs, but maybe it does, not sure.

Wim Leers’s picture

FileSize
19.49 KB
1.84 KB

HURRAY! nod_++! Thanks for working on this!

  • I tested it with in-place editing. Now it's finally working as intended for e.g. titles and tags.
  • Vertical Tabs summaries still work correctly.
  • Filter guidelines still work correctly.
  • File validation works (I didn't even know this existed!).

Busted in-place editing of image fields confirmed: WTF!? Issue opened: #2177289: In-place editing of image fields is broken.

Attached reroll only fixes docs/whitespace.

Wim Leers’s picture

Issue tags: +Spark, +sprint
nod_’s picture

Issue tags: -Needs accessibility review
FileSize
19.22 KB

Only change is adding the detach function.

nod_’s picture

FileSize
19.22 KB
578 bytes

This should be RTBC-able.

Wim Leers’s picture

Status: Needs review » Reviewed & tested by the community

The remaining todo was solved, the new todo in #13 is blocked on another issue. All is working well as per #10. In #10, I rerolled the patch, but I only changed whitespace/docs. Therefor I can RTBC :)

webchick’s picture

Status: Reviewed & tested by the community » Needs work

While I appreciate the completeness of bug fixing done here, this patch is a total kitten-eating monster. :( Can we please have a patch that just solves the problem at hand?

nod_’s picture

Status: Needs work » Needs review
Related issues:
FileSize
20.31 KB
4.44 KB

"minimum" version of the code is an undocumentable mess. If you look at the code after you applied the previous patch and this one, tell me which one is easier to understand. Readable patch is hardly a criteria if the resulting code is ugly.

2 patches:
- the minimum amount of changes.
- the one with code that's actually maintainable without being a PITA (to apply on top of the previous one).

Wim Leers’s picture

Status: Needs review » Reviewed & tested by the community

Manually tested again, same results as in #10.

nod_’s picture

Will take the validation stuff and the refactor in separate issues (see child issues), please commit the 4kb patch of #16 so I can get the rest rolling.

catch’s picture

Status: Reviewed & tested by the community » Fixed

OK I've gone ahead and committed the 4kb patch. Thanks!

Wim Leers’s picture

Issue tags: -sprint
droplet’s picture

+++ b/core/misc/form.js
@@ -116,6 +116,82 @@ Drupal.behaviors.formSingleSubmit = {
+   var $forms = $context.find('form').once('form-updated');

if contextIsForm is TRUE, it skipped apply "ONCE" function. Also, it need not to find the 'form' anymore ?

+++ b/core/misc/form.js
@@ -116,6 +116,82 @@ Drupal.behaviors.formSingleSubmit = {
+    var currentFields = $(context).attr('data-drupal-form-fields');

$(context) = $form

nod_’s picture

Priority: Critical » Normal
Status: Fixed » Needs review
FileSize
1.1 KB

Right, so the init is skiped if context is a form indeed.

For now all the ajax requests in this case are for forms that are deleted after they are submitted so it won't trigger any bugs. But it might once contrib get in there.

Follow-up patch adds the once and removeOnce when context is form.

droplet’s picture

Status: Needs review » Reviewed & tested by the community
nod_’s picture

Title: form.js' formUpdated event is unreliable/incomplete » Follow-up: form.js' formUpdated event is unreliable/incomplete
webchick’s picture

Title: Follow-up: form.js' formUpdated event is unreliable/incomplete » form.js' formUpdated event is unreliable/incomplete
Priority: Normal » Critical
Status: Reviewed & tested by the community » Fixed

Committed and pushed to 8.x. Thanks!

Status: Fixed » Closed (fixed)

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