jQuery UI Autocomplete has the option of autoFocus that will automatically select the first result.

This allows users to more efficiently fill out the form by just tabbing away or clicking submit, versus having to click with their mouse or use the down arrow.

I've spent over an hour hacking away at it but the jQuery is way beyond me.

Comments

philip-iii’s picture

Title: autoFocus » autoFocus and usability considerations

This is something I would very much like to see as well. A few other remarks:

Unless there is an issue with it, it would be very nice to to allow selection by pressing enter. I found it very unintuitive to first select the item with the arrow keys and then have to press tab, since pressing enter left the field empty the first several times I tried it. Ideally, tab should be used to go through the list of suggestions, and, if there is only one suggestion, select it automatically, as the original post suggested (a bit a la Firefox awesome bar for example). Arrows + Tab should rather be Arrows + Enter, but that's just my opinion.

The second issue with focus (which may as well have to be filled as a separate issue) is related to multiple values. When selecting "Add Another Item" (conveniently reachable by pressing tab after filling out the last available autocomplete field in the group, the focus is reset to the beginning of the multi-valued block (I guess this applies to references only, as multivalued taxonomy fields are separated by comma), rather than the newly added field.

Fidelix’s picture

IMO, These considerations are very important. Subscribing...

jrie’s picture

Component: Code » Single values

I'm also in need of a feature that a user can commit a tag by pressing enter, can you add this change to the module?

Line 302 of "autocomplete_deluxe.js" =>

if (event.which == 188 && (value.split('"').length - 1) != -1

to

if (event.which == 188 && (value.split('"').length - 1) != -1 || (event.which == 13 && (value.split('"').length - 1) != -1) )

or similiar.
So that the user can press return also to add a tag instead of using the comma separation only?

rajab natshah’s picture

Issue summary: View changes
Status: Active » Closed (outdated)