When adding or editing a node, if you have a form field such as a textfield with more than one possible value, when you click "Add another item," the field is added and the focus falls either on the container (if you are not an admin) or at the top of the page (if you are an admin). This behavior creates accessibility problems for visually impaired users, because it is not clear to them where the focus on the screen is when the new input field has been added. Can the focus be put on the most recently added field instead?

Putting the focus on the container might seem close enough, but I have had points taken from me for this issue during U.S. Government 508 compliance tests.

This issue is significant for any site that wants to be fully accessible. This is particularly important for U.S. Government websites (which form a rather large market for Drupal), which must be meet Section 508 compliance guidelines for accessibility.

Comments

mckinzie25’s picture

mckinzie25 CreditAttribution: mckinzie25 commented
Assigned: Unassigned » mckinzie25

I am working on a patch or, ideally, a module for this.

mckinzie25’s picture

mckinzie25 CreditAttribution: mckinzie25 as a volunteer commented

Ok, I have created a sandbox module to address this for Drupal 7. For textfields and textareas, this module sets focus to the newly added field, for file uploads it sets focus to the link to the newly added file, and for file removals it creates a message indicating the file has been removed and sets focus to the message.

This functionality of this module only affects node- and taxonomy term-editing forms; it does not affect forms created through Webforms or the Form API. I will be continuing to work on this to expand its useful.

Link: https://www.drupal.org/sandbox/mckinzie25/2447493

mgifford’s picture

mgifford
he/him
Primary language English
CreditAttribution: mgifford commented

Has this been tested to see that it isn't also a problem in Drupal 8?

mckinzie25’s picture

mckinzie25 CreditAttribution: mckinzie25 commented

This is a problem in Drupal 8.0.0-beta7, at least for node add and edit pages. Adding a new textfield for unlimited textfields will set focus to the container if you are a non-admin, and to the top of the page if you an admin. Adding a file will set focus at the top of the page whether you are an admin or not.

mgifford’s picture

mgifford
he/him
Primary language English
CreditAttribution: mgifford commented
Project: » Drupal core
Version: » 8.0.x-dev
Component: User interface » ajax system

Ok, then we should change the Project to Drupal core and set it to D8.

It needs to be fixed in D8 & then brought back to D7.

nod_’s picture

nod_
Primary language French
Location Lille
CreditAttribution: nod_ commented
Category: Feature request » Bug report
Issue tags: +JavaScript

#4 sounds like a bug. Any news on the patch? if you're not working on it please unassign yourself so someone else can take it up.

mckinzie25’s picture

mckinzie25 CreditAttribution: mckinzie25 commented
Assigned: mckinzie25 » Unassigned

I will try to find time to work on it, but I am unassigning myself.

kyuubi’s picture

kyuubi CreditAttribution: kyuubi commented

I would be interested in working on this.

Any pointers on where to start?

There is a .ajax-new-content wrapper added to the newly added field.

Could we maybe add a behaviour in forms.js that gets called in triggerFormUpdated and adds focus to the element with that class?

nod_’s picture

nod_
Primary language French
Location Lille
CreditAttribution: nod_ commented

First thing would be to investigate why this is working properly when the user is admin (and using the seven theme I assume) and why it is not working when the user is not an admin.

Because if it's a theme thing or possibly a missing dependency on some JS library, then there is no need to add more JS code :)

kyuubi’s picture

kyuubi CreditAttribution: kyuubi commented

Hi @nod_ it according to the info above, the issue is always happening.

It just happens to sometimes focus on the container and other times on the top of the page.

I am trying with the date field for example, logged in with admin, and focus just gets dropped after adding another item.

mckinzie25’s picture

mckinzie25 CreditAttribution: mckinzie25 commented

According to my tests, this issue is occurring regardless of theme or role. Bear in mind, this problem doesn't just happen with fields that can have unlimited responses. In Drupal 8, for both admins and non-admins, if you upload a file in a field that allows only a single file upload, the focus goes to the top of the page after the file uploads.

I'll take a look into this as well and hopefully give some useful input.

mckinzie25’s picture

mckinzie25 CreditAttribution: mckinzie25 as a volunteer commented

For Drupal 8, most of these problems with losing field focus are addressed in https://www.drupal.org/node/2124397. However, the patches provided in that chain still don't address losing focus on file and image uploads.

mgifford’s picture

mgifford
he/him
Primary language English
CreditAttribution: mgifford commented
Related issues: +#2124397: Keyboard focus is lost after an AJAX page update

Should this be marked as a duplicate of #2124397: Keyboard focus is lost after an AJAX page update

mckinzie25’s picture

mckinzie25 CreditAttribution: mckinzie25 as a volunteer commented

I agree this should be marked as a duplicate of #2124397: Keyboard focus is lost after an AJAX page update, especially if that thread is now going to take file uploads into consideration.

mgifford’s picture

mgifford
he/him
Primary language English
CreditAttribution: mgifford commented
Status: Active » Closed (duplicate)