Clicking on + icon makes the page scroll to the top

Created on 28 December 2018, over 6 years ago
Updated 19 September 2024, 7 months ago

Problem/Motivation

Clicking on + to add a taxonomy term field to the index scrolls the page to the top. A user who is not very familiar with Drupal wouldn't know what happened.

Here's how to reproduce the issue:

1) Go to /admin/config/search/search-api/index//fields. Replace in the URL by the machine name of your index.
2) Click on "Add fields" button.
3) You should see a popup similar to the one shown below:

4) Scroll down the page so that you are below the fold.
5) Click on any "(+)" icon. In my case, I clicked on the icon next to "Next steps planned for each goal?" field.
6) JS forces the page to scroll to the top.

Proposed resolution

Page should not scroll to the top.

🐛 Bug report
Status

Fixed

Version

1.11

Component

User interface

Created by

Live updates comments and jobs are added and updated live.
  • Usability

    Makes Drupal easier to use. Preferred over UX, D7UX, etc.

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.

  • First commit to issue fork.
  • Hey!

    This patch is in master, but unfortanetly we still experience this issue.
    I tried a few things, but that doesn't work. Here's what I tried:

              $item['expand_link'] = [
                '#type' => 'link',
                '#title' => '(-) ',
                '#attributes' => [
                  'data-disable-refocus' => ['true'],
                  'data-refocus-blur' => ['true'],
                ],
                '#url' => $link_url,
                '#ajax' => [
                  'wrapper' => $this->formIdAttribute,
                  'disable-refocus' => TRUE,
                ],
              ];
    

    Cheers!

  • 🇬🇧United Kingdom scott_euser

    Yep as per #15 I could still reproduce it, but I am fixing it in Improve the Search API admin UI for adding/editing fields Active . The problem was drupal ajax attempts to refocus on the expand button, but expand is replaced by the collapse button. We need to maintain a 'data-drupal-selector' element that is consistent between the two so drupal ajax knows its meant to be the same focus target.

Production build 0.71.5 2024