"Automatically submit selection" UX missing visual feedback

Created on 5 May 2020, over 5 years ago
Updated 20 August 2025, 30 days ago

Context:

Using "Automatically submit selection" to select content in a view

Problem:

Selected lines in the view

  • are not marked if selected
  • have no cursor: pointer; to show they are clickable
  • show no more checkbox or radio

Furthermore the view is not submitted, at least in modal, when clicking a line. (I'm not sure if this is intended).

In entity_browser.view.js these are the lines handling these problems:

// If "auto_select" functionality is enabled, then selection column is
        // hidden and click on row will actually add element into selection
        // display over javascript event. Currently only multistep display
        // supports that functionality.
        if (drupalSettings.entity_browser_widget.auto_select) {
          var selection_cells = views_instance.$view.find('.views-field-entity-browser-select');

          // Register on cell parents (rows) click event.
          selection_cells.parent()
            .once('register-row-click')
            .click(function (event) {
              event.preventDefault();

              var $row = $(this);

              // Ensure the use of the entity browser input.
              var $input = $row.find('.views-field-entity-browser-select input.form-checkbox, .views-field-entity-browser-select input.form-radio');

              // Get selection display element and trigger adding of entity
              // over ajax request.
              $row.parents('form')
                .find('.entities-list')
                .trigger('add-entities', [[$input.val()]]);
            });

          // Hide selection cells (selection column) with checkboxes.
          selection_cells.hide();
        }

Proposed solution:

My suggestions is to

  • keep the checkbox or radio to show the user that he should make a selection here
  • add coursor: pointer; by css. Perhaps there's a drupal class like ".selectable", ".clickable" or something like this existing already in table selection?
  • Add a class to highlight a selected row
  • Remove the event.preventDefault(); to actually mark the checkboxes / radios
  • Sync the checked / highlighted lines with the selection (eventually in a follow-up)

Additionally I think we should use the chance to select the checkbox / radio if clicking the line even with "Automatically submit selection" disabled... This way the line should behave like a label and not require the user to exactly hit the form element representing a line. There is already a similar issue for that point which goes one step further with double click: #2959832: Double click on a row should add to selection and submit

🐛 Bug report
Status

Active

Version

2.0

Component

User interface

Created by

🇩🇪Germany Anybody Porta Westfalica

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.

Production build 0.71.5 2024