Contrib.social

Can't type in Select2 list text fields

Open on Drupal.org →
Created on 30 December 2022, over 2 years ago
Updated 1 March 2023, about 2 years ago

When editing a paragraph with a select2 → list text (select) field, it renders properly but you cannot type in the textfield at the top to filter the results.

It is a known issue in the select2 → community that select2 fields do not behave properly in modals without extra work. The same goes for Drupal jQuery modal dialogs.

The solution is to set Form's class as the dropdownParent.

When using Form API, do the following to ensure your custom select2 field works in the layout_paragraphs modal.

// $form_id uses underscores, but the rendered form uses hyphens in the class.
$form_class = str_replace('_', '-', $form_id);
$form['select2'] = [
  '#type' => 'select2',
  '#title' => t('My select2 form element'),
  '#options' => [
    'foo',
    'bar',
  ],
  '#select2' => [
    // Set the dropdownParent to the form's class.
    'dropdownParent' => '.' . $form_class,
  ],
];

For regular Drupal fields, a patch will be attached in the next comment.

🐛 Bug report
Status

Needs review

Version

2.0

Component

Code

Created by

🇺🇸United States andrewmriv Southern California

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

Not all content is available!

It's likely this issue predates Contrib.social: some issue and comment data are missing.

  • Comment about 2 years ago →
    🇳🇱Netherlands falco010 🇳🇱 The Netherlands

    We had the same issue and the patch provided fixed the issue for us, thanks @andrewmriv!

  • Status changed to RTBC over 1 year ago
  • Comment over 1 year ago →
    🇨🇦Canada endless_wander

    Thank you, +1 for the patch. Fixed same problem I was having with Select2 elements in the Layout Paragraphs modal.

  • Status changed to Active over 1 year ago
  • Comment over 1 year ago →
    🇺🇸United States justin2pin

    Thanks for this patch. If I'm understanding this correctly, though, the issue is actually with the select2 module, and not Layout Paragraphs? I think someone should open and issue / write a patch for select2 that correctly assigns the dropdownParent attribute more holistically.

  • Comment about 1 year ago →
    🇺🇸United States daletrexel Minnesota, USA

    I was not able to get the patch in #2 to work for my site. Array key 'widget' does not exist.

    However, 🐛 Issue with z-index when opening in modal dialog RTBC in the Select2 issue queue DOES work for me in my use case (testing patch #17). So, as @justin2pin suggests, this is probably better fixed in Select2 for all modals, rather than here for Layout Paragraphs. And no new issue/patch needs to be created!

  • Status changed to Closed: works as designed about 2 months ago
  • Comment about 2 months ago →
    🇺🇸United States pixelwhip
contrib.social Blog FAQ Discussions
Production build 0.71.5 2024