jquery / jquery-ui

Source
Commits
Network (211)
Graphs
Tree: de266a1

The official jQuery user interface library. — Read more

This URL has Read+Write access

Autocomplete: Handle clicks outside the autocomplete after scrolling the results (which causes the body to gain focus). Fixes #5903 - Autocomplete doesn't close after scrolling.

scottgonzalez (author)

Thu Aug 05 05:51:54 -0700 2010

commit de266a1275efa405eb71
tree d2f0da9cbecaf229d137
parent ed07f0a05656d2c66db4

ui/jquery.ui.autocomplete.js

19 ••••

ui/jquery.ui.autocomplete.js

View file @ de266a1

@@ -119,7 +119,24 @@ $.widget( "ui.autocomplete", {
       .addClass( "ui-autocomplete" )
       .appendTo( $( this.options.appendTo || "body", doc )[0] )
       // prevent the close-on-blur in case of a "slow" click on the menu (long mousedown)
-      .mousedown(function() {
+      .mousedown(function( event ) {
+        // clicking on the scrollbar causes focus to shift to the body
+        // but we can't detect a mouseup or a click immediately afterward
+        // so we have to track the next mousedown and close the menu if
+        // the user clicks somewhere outside of the autocomplete
+        var menuElement = self.menu.element[ 0 ];
+        if ( event.target === menuElement ) {
+          setTimeout(function() {
+            $( document ).one( 'mousedown', function( event ) {
+              if ( event.target !== self.element[ 0 ] &&
+                event.target !== menuElement &&
+                !$.ui.contains( menuElement, event.target ) ) {
+                self.close();
+              }
+            });
+          }, 1 );
+        }
+
         // use another timeout to make sure the blur-event-handler on the input was already triggered
         setTimeout(function() {
           clearTimeout( self.closing );

1 notes on commit `de266a1` Show line notes below

jzaefferer added a note to de266a1 repo collab

Thu Aug 05 06:27:05 -0700 2010

What an endless source of joy!

Please log in to comment.

...	...	@@ -119,7 +119,24 @@ $.widget( "ui.autocomplete", {
119	119	.addClass( "ui-autocomplete" )
120	120	.appendTo( $( this.options.appendTo \|\| "body", doc )[0] )
121	121	// prevent the close-on-blur in case of a "slow" click on the menu (long mousedown)
122		- .mousedown(function() {
	122	+ .mousedown(function( event ) {
	123	+ // clicking on the scrollbar causes focus to shift to the body
	124	+ // but we can't detect a mouseup or a click immediately afterward
	125	+ // so we have to track the next mousedown and close the menu if
	126	+ // the user clicks somewhere outside of the autocomplete
	127	+ var menuElement = self.menu.element[ 0 ];
	128	+ if ( event.target === menuElement ) {
	129	+ setTimeout(function() {
	130	+ $( document ).one( 'mousedown', function( event ) {
	131	+ if ( event.target !== self.element[ 0 ] &&
	132	+ event.target !== menuElement &&
	133	+ !$.ui.contains( menuElement, event.target ) ) {
	134	+ self.close();
	135	+ }
	136	+ });
	137	+ }, 1 );
	138	+ }
	139	+
123	140	// use another timeout to make sure the blur-event-handler on the input was already triggered
124	141	setTimeout(function() {
125	142	clearTimeout( self.closing );

jquery / jquery-ui

1 notes on commit de266a1 Show line notes below

Your current locale selection: English. Choose another?

1 notes on commit `de266a1` Show line notes below