The "Save" button at admin/content/node-type/[type]/fields is only relevant if you've dragged and dropped some fields.

This task is to add a bit of javascript to hide the button until drag and drop has taken place on the page (so it'll be shown along with the "your changes will only be saved message", and only then). We only want to conditionally hide the button with javascript, so that it shows if js is disabled, not the other way 'round.

CommentFileSizeAuthor
#7 content.js586 bytesximo
#7 conditionalsave2.patch1.1 KBximo
#4 conditionalsave.patch672 bytesximo
#4 content.js831 bytesximo

Comments

catch’s picture

Title: Make drag and drop save button conditional » DROP: Make drag and drop save button conditional
yched’s picture

True, never occurred to me :-)
tabledrag.js has everything ready for us (see Drupal.tableDrag.prototype.row.prototype.onSwap)

karens’s picture

Title: DROP: Make drag and drop save button conditional » UMN Usability / DROP: Make drag and drop save button conditional
Component: content.module » Usability
ximo’s picture

Assigned: Unassigned » ximo
Status: Active » Needs review
StatusFileSize
new831 bytes
new672 bytes

I've claimed this task, and have made a working patch.

I based my code on block.js, as recommended in tabledrag.js.

onSwap would show the Save button before the warning message was shown, so I used onDrop instead. In order to know that the table really had been changed, I used onSwap to set a variable to true.

So much (relatively) JavaScript was required that it couldn't be easily injected inline, so I made a content.js file and put it there. I don't know if you would want to have a .js file for all CCK's JavaScript. Alternatively, I could compress this JS and include it inline - however it would make maintenance difficult.

The content.js file contains console.log() functions so that you may see when it fires using Firebug.

Btw, I noticed that weight elements in the table are textfields and not selects when JS is turned off... I guess you're not done with the form yet :)

yched’s picture

Status: Needs review » Needs work

Thanks ximo !
Adding a new content.js is perfictly fine IMO. It should see other additions shortly anyway.

Is the tableChanged = true; flag really needed ? Tabledrag.js already sets its own
(see self.changed = true; in Drupal.tableDrag.prototype.dropRow).

Strangely enough, the 'Save' button on my 'Manage fields' tab has the id #edit-submit-1, instead of #edit-submit as expected in your patch..
And the search box's 'Search' button is #edit-submit-2.
Are form element id's unpredictable, by any chance ?
If so, we should probably add a specific class to our 'Save' button, and use that class in the jQuery selector instead.

Aside from this, the patch seems to work perfectly well.

catch’s picture

///Are form element id's unpredictable, by any chance ?

Yep. A patch went in somewhere to ensure unique ids for everything - any chance there's two id="edit-submit" on that page? Class as a selector sounds great to avoid this inconsistency though.

ximo’s picture

Status: Needs work » Needs review
StatusFileSize
new1.1 KB
new586 bytes

I didn't notice the self.changed flag - thanks! The JS code looks much better now. I also removed the table variable which was left by mistake, as well as the console.log().. now that you've seen that it works.

A class name of content-admin-field-overview-submit (long, but precise) has been added to the Save button, and is now used to reference the button from JS.

You may also want to place the drupal_add_js() call that loads content.js somewhere more appropriate if you intend to use the file for other purposes.

yched’s picture

Status: Needs review » Fixed

Committed. I simply moved the line that adds the class into the theme function, since this is also where we add the js calls that use it.

Thanks !

Anonymous’s picture

Status: Fixed » Closed (fixed)

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