Support for Drupal 7 is ending on 5 January 2025—it’s time to migrate to Drupal 10! Learn about the many benefits of Drupal 10 and find migration tools in our resource center.
When there is only a single editable element and the submit button for said element is hidden, the jQuery selector is not specific enough. If the field itself has any submit buttons in it (e.g. commentfield) those buttons are hidden as well.
The field below should have a remove and an add new comment button:
Like so:
Comment | File | Size | Author |
---|---|---|---|
#7 | editablefields-ajaxifyfilefield-1398946-7.patch | 1.23 KB | robby.griffin |
#2 | editablefields.js_.patch | 973 bytes | micheas |
#1 | hide-submit-selector-1398946-2.patch | 815 bytes | BassistJimmyJam |
Comments
Comment #1
BassistJimmyJam CreditAttribution: BassistJimmyJam commentedAttached is a patch. I added the results of the selector to find the submit button to hide to a variable and am using that to hide and trigger the button on change. This allows the element to be used in both places without having to search for it each time.
Comment #2
micheas CreditAttribution: micheas commentedThis whole concept of hiding submit buttons should probably be scrapped and rethought.
IE9 and some of the latest versions of chrome do not submit content attached to hidden fields.
This means that the ajax is unbound and you get json output to either save (IE) or in your browser window (chrome).
I had a late night inspiration that resulted in the attached patch.
The patch has at least one issue that I can see. it doesn't account for borders that are set on the submit button.
Comment #3
johnvThe same problem happens for files, not only for texts. See #1321304: Hiding 'Submit'-button is not specific enough for multiple-value File field which contains the following 'patch':
Comment #4
tim.plunkettI don't understand why .hide() wouldn't work here, and if it doesn't,
.addClass('element-hidden')
would be better anyway.See element-hidden and element-invisible: http://drupalcode.org/project/drupal.git/blob/refs/heads/8.x:/core/modul...
Comment #5
micheas CreditAttribution: micheas commentedIE 9 and chrome 19 do not submit form elements that have css of display:none;
.hide() and .css('display','none') and .addClass('element-hidden') ALL fail on IE9 and chrome 19.
This is apparently something to do with some specific malware.
Personally I think the browsers are going about fixing the problem the wrong way, but from a practical standpoint, if you support IE9 and the next version of chrome, you have to accept that display:none on form elements is not going to work anymore.
Comment #6
micheas CreditAttribution: micheas commentedActually, based on a conversation on IRC #drupal-contribute we should be adding the class "element-invisible" to the buttons we want hidden.
modules/system/system.base.css has element-invisible defined in addition to element-hidden because of form issues with hidden fields.
Comment #7
robby.griffin CreditAttribution: robby.griffin commentedI needed to make file fields easier to use, so I added some JQuery logic to ajaxify file fields. There are probably a lot of improvements to be made, and there seems to be an issue if you upload multiple files in a row where Drupal doesn't reload the "Add New File" widget, but it seems to work great for my purposes, and I would love to get some feedback on it.
Comment #8
dags CreditAttribution: dags commentedI realize this issue has been stale for quite some time but where do we stand on this? Is the patch in #2 good except for replacing .add('display', 'none') with .addClass('element-hidden')?
@robby.griffin seems like your patch is addressing a similar - but different - issue. Would you mind opening a new issue describing why the patch is needed and post it in there. Thanks!