Problem/Motivation
We recently upgraded the select2_all module to the latest release with Drupal 11 support and noticed that there is an issue with select2 form fields when rendered in a modal window. This issue has already been noted in the select2 module issue queue long ago (See #3211796: Issue with z-index when opening in modal dialog). There is a patch there that folks report helps, but it won't apply here in the select2_all module as this module doesn't involve the creation of a Drupal custom element (Select2) as is done in the select2 module.
Steps to reproduce
There are a variety of ways to reproduce this, but in my case I was on the field overview page for a node type. I clicked the Edit button for one of the fields and by default (using Claro in case it matters) the field config opened in a modal. If the field config included a select form field that select2 has taken over, clicking the select results in the dropdown of options not appearing visually in the modal, but rather rendering underneath the modal. This is the same as described in the issue noted above for select2 module. I even reproduced using the specific case there of using the Drupal Media ckeditor toolbar button.
Proposed resolution
Remaining tasks
User interface changes
API changes
Data model changes
| Comment | File | Size | Author |
|---|---|---|---|
| #7 | test.PNG | 57.97 KB | angel_devoeted |
Issue fork select2_all-3583520
Show commands
Start within a Git clone of the project using the version control instructions.
Or, if you do not have SSH keys set up on git.drupalcode.org:
Comments
Comment #2
jaydub commentedComment #3
mikelutzVerified and setting to critical. I'm not sure we will be able to set the parent here, because of the differences in the way that this module works, at least without a whole hook_form_alter to find select elements and pass the form id in the render array, but I hate to do that. We will look into it. At minimum we can up the z-index on the dropdown to something like 100000, but it's not the ideal solution.
Comment #4
mikelutzLooks like Dave fixed this years ago in https://www.drupal.org/project/select2_all/issues/3091977, but we had a regression a few weeks ago with https://git.drupalcode.org/project/select2_all/-/merge_requests/9/diffs?... . We refactored ckeditor 4 stuff out, but the comment on the z-index made it seem like that was only needed for ckeditor 4, when we actually need it for all modals.
Comment #6
mikelutzPut back the z-index, set it to 1500, to beat the modals in the admin ui, probably the best we can do for now.
Comment #7
angel_devoeted commentedTested the MR across various administrative UI modals (Views, field settings, etc.) and it works as expected.
The dropdown correctly renders on top of the dialog overlays.
The z-index: 1500 seems to be a safe choice to avoid these regressions.
Comment #9
matthandSeeing the community reviewed so marking as RTBC. I'm reviewing now and expect to merge and cut new release soon. Thank you!
Comment #11
matthandMerged and new release 8.x-1.6 is out. Thank you for reporting, contributing and your reviews!