Quantcast
Channel: Issues for Drupal core
Viewing all articles
Browse latest Browse all 293129

Focus state bug on text field AJAX calls

$
0
0

Problem/Motivation

#1824636: Do not move the cursor to the top of the page on ajax calls solved a form focus state issue where by default the focus state comes back to the form element after rebuilding part of the form after an AJAX call. This was fixed against a select element in the views module. The problem is that it works fine on select elements and checkboxes, but not on text fields and textareas. The default AJAX event for these text fields is 'blur', meaning AJAX triggers when unfocusing, for example by clicking anywhere else or pressing tab. The problem is that that by doing so, the focus comes back on these fields by default now, making it impossible to select any other form element in the form.

I don't know if this happens anywhere in Drupal out of the box, but I included a small module to reproduce the issue. Enable ajax_test and navigate to /admin/config/development/ajax-test to see the form.
A quick example of this behaviour is shown here. The top field has an AJAX callback (the sample module has it on both, resulting in a never ending back and forth focussing between the two fields). The focus always comes back to that field:
animated gif showing AJAX bug

Proposed resolution

I'm not sure what the best solution would be.

  1. I think ideally the new focus location would be passed in the AJAX callback, and placed back after rebuilding the form, but I'm not even sure if this is technically possible.
  2. If this doesn't work the least we could do is disable the auto refocus by default for text fields and textareas. This can be done by including the following property: $element['#ajax']['disable-refocus'] = TRUE
  3. suggestions?

Viewing all articles
Browse latest Browse all 293129

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>