Opened 13 years ago

Closed 11 years ago

#7024 closed bug (fixed)

Autocomplete menu options are activated even if mouse is not moved

Reported by: lex1982 Owned by:
Priority: minor Milestone: 1.9.0
Component: ui.autocomplete Version: 1.8.9
Keywords: Cc:
Blocked by: Blocking:

Description

When the autocomplete menu opens and the mouse is over one option -- that is just appearing --, this option is activated even if the user does not move the mouse.

While this is usually not a severe bug when the user is forced to select one of the autocomplete options, it is pretty annoying when the options are just suggestions and the user may enter an arbitrary text (and for example submit it by pressing ENTER). Then, it happens very often that options are accidently selected because they were automatically activated.

The only solution I found that works in all browsers is not to use the mouseenter event for the menu options but mousemove. It has to be checked in the event handler if the mouse was really moved (mouse coordinates have to be saved each time the menu or a menu option is activated). Since mousemove is fired very often it should be additionally checked if the hovered menu item is already selected to avoid unnecessary activate()-calls.

The bug can be easily reproduced here: http://jqueryui.com/demos/autocomplete/

Just position the mouse below the input and type something.

Change History (8)

comment:1 Changed 13 years ago by lex1982

I just noticed this is very similar to http://bugs.jqueryui.com/ticket/6218. 6218 is just a particular consequence of this bug.

comment:2 Changed 13 years ago by Scott González

#6218 is a duplicate of this ticket.

comment:3 Changed 13 years ago by Scott González

Ensure that when this is fixed the scrolling issue described in #6218 is fixed as well.

comment:4 Changed 12 years ago by lschult2

FYI, this is a workaround that seems to work for me. I put this into my code to redefine the activate method of ui.menu and the search method of ui.autocomplete.

 $.widget("ui.menu", $.ui.menu, {
  activate: function( event, item ) {
   var lastX = $('ul.ui-autocomplete').data('lastPageX');
   var lastY = $('ul.ui-autocomplete').data('lastPageY');
   if (!event.pageX && !event.pageY || lastX && lastY) {
    // regular activate code from jquery.ui.autocomplete put here
   }
   $('ul.ui-autocomplete').data('lastPageX', event.pageX);
   $('ul.ui-autocomplete').data('lastPageY', event.pageY);
  }
 });

 $.widget("ui.autocomplete", $.ui.autocomplete, {
  search: function( value, event ) {
   $('ul.ui-autocomplete').data('lastPageX', 0);
   $('ul.ui-autocomplete').data('lastPageY', 0);
   // regular search code from jquery.ui.autocomplete put here
  });
Last edited 12 years ago by lschult2 (previous) (diff)

comment:5 Changed 12 years ago by Jörn Zaefferer

Resolution: fixed
Status: newclosed

comment:6 Changed 12 years ago by Jörn Zaefferer

Resolution: fixed
Status: closedreopened

The fix got reverted, as it caused more damage then fixing issues: https://github.com/jquery/jquery-ui/commit/c17f245d9848ae865d400dabb02ea954aa8da645

The regular menu select event got messed up.

comment:7 Changed 12 years ago by k_borchers

I have submitted a new pull request which should have no effect on the regular menu select event.

https://github.com/jquery/jquery-ui/pull/280

comment:8 Changed 11 years ago by Kris Borchers

Resolution: fixed
Status: reopenedclosed

Autocomplete: Added check to prevent accidental focus of menu-item on page load in Firefox. Fixed #7024 - Autocomplete menu options are activated even if mouse is not moved.

Changeset: 098dd1404b7b6025a5735495a91ca2b964c5cb3e

Note: See TracTickets for help on using tickets.