Contrib.social

I added a data attribute to ui-autocomplete for managing multiple autocompletes

Open on Drupal.org →
Created on 2 November 2022, about 2 years ago
Updated 3 July 2023, over 1 year ago

Problem/Motivation

I have a page with multiple autocompletes. They are displayed in different places so they are styled differently. The only unique attribute was ID, however, it changed paged to page.

Steps to reproduce

Add more than one search autocomplete and you will see #ui-id-1, #ui-id-2, #ui-id-3 etc with no unique/descriptive selector.

Data model changes

I simply added a data-input-ref attribute to the ui-autocomplete that would tell me exactly what input this autocomplete is from. It ends up being the machine name of the autocomplete.

Without the patch you see the rendered autocomplete as:

<ul id="ui-id-1" tabindex="0" class="ui-menu ui-widget ui-widget-content ui-autocomplete ui-front" unselectable="on" data-sa-theme="minimal">
...
</ul>

With the patch:

<ul id="ui-id-1" tabindex="0" class="ui-menu ui-widget ui-widget-content ui-autocomplete ui-front" unselectable="on" data-input-ref="your_autocomplete_machine_name" data-sa-theme="minimal">
...
</ul>
✨ Feature request
Status

Fixed

Version

3.0

Component

Code

Created by

🇺🇸United States rondog469

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.

contrib.social Blog FAQ Discussions
Production build 0.71.5 2024