Fix for #5120 - create menu only once and return that element from the widget method, put ui-autocomplete class on menu

1 files changed, 51 insertions, 51 deletions

diff --git a/ui/jquery.ui.autocomplete.js b/ui/jquery.ui.autocomplete.js
index 932485ebc..f326fd903 100644
--- a/ui/jquery.ui.autocomplete.js
+++ b/ui/jquery.ui.autocomplete.js
@@ -21,7 +21,6 @@ $.widget( "ui.autocomplete", {
 	_create: function() {
 		var self = this;
 		this.element
-			.addClass( "ui-autocomplete" )
 			.attr( "autocomplete", "off" )
 			// TODO verify these actually work as intended
 			.attr({
@@ -92,6 +91,44 @@ $.widget( "ui.autocomplete", {
 		this.response = function() {
 			return self._response.apply( self, arguments );
 		};
+		this.menu = $("<ul/>")
+			.addClass( "ui-autocomplete" )
+			.appendTo( this.element.parent() )
+			.menu({
+				focus: function( event, ui ) {
+					var item = ui.item.data( "item.autocomplete" );
+					if ( false !== self._trigger( "focus", null, { item: item } ) ) {
+						// use value to match what will end up in the input
+						self.element.val( item.value );
+					}
+				},
+				selected: function( event, ui ) {
+					var item = ui.item.data( "item.autocomplete" );
+					if ( false !== self._trigger( "select", event, { item: item } ) ) {
+						self.element.val( item.value );
+					}
+					self.close( event );
+					self.previous = self.element.val();
+					// only trigger when focus was lost (click on menu)
+					if ( self.element[0] != document.activeElement ) {
+						self.element.focus();
+					}
+				}
+			})
+			.zIndex( this.element.zIndex() + 1 )
+			// workaround for jQuery bug #5781 http://dev.jquery.com/ticket/5781
+			.css({ top: 0, left: 0 })
+			.position({
+				my: "left top",
+				at: "left bottom",
+				of: this.element,
+				collision: "none"
+			})
+			.hide()
+			.data( "menu" );
+		if ( $.fn.bgiframe ) {
+			 menu.element.bgiframe();
+		}
 	},
 
 	destroy: function() {
@@ -170,10 +207,9 @@ $.widget( "ui.autocomplete", {
 
 	close: function( event ) {
 		clearTimeout( this.closing );
-		if ( this.menu ) {
+		if ( this.menu.element.is(":visible") ) {
 			this._trigger( "close", event );
-			this.menu.element.remove();
-			this.menu = null;
+			this.menu.element.hide();
 		}
 		if ( this.previous != this.element.val() ) {
 			this._trigger( "change", event );
@@ -200,59 +236,19 @@ $.widget( "ui.autocomplete", {
 	},
 
 	_suggest: function( items ) {
-		if (this.menu) {
-			this.menu.element.remove();
-		}
-		var self = this,
-			ul = $( "<ul></ul>" ),
-			parent = this.element.parent();
-
+		this.menu.element.empty();
+		var ul = this.menu.element;
 		$.each( items, function( index, item ) {
 			$( "<li></li>" )
 				.data( "item.autocomplete", item )
 				.append( "<a>" + item.label + "</a>" )
 				.appendTo( ul );
 		});
-		this.menu = ul
-			.addClass( "ui-autocomplete-menu" )
-			.appendTo( parent )
-			.menu({
-				focus: function( event, ui ) {
-					var item = ui.item.data( "item.autocomplete" );
-					if ( false !== self._trigger( "focus", null, { item: item } ) ) {
-						// use value to match what will end up in the input
-						self.element.val( item.value );
-					}
-				},
-				selected: function( event, ui ) {
-					var item = ui.item.data( "item.autocomplete" );
-					if ( false !== self._trigger( "select", event, { item: item } ) ) {
-						self.element.val( item.value );
-					}
-					self.close( event );
-					self.previous = self.element.val();
-					// only trigger when focus was lost (click on menu)
-					if ( self.element[0] != document.activeElement ) {
-						self.element.focus();
-					}
-				}
-			})
-			.zIndex( this.element.zIndex() + 1 )
-			// workaround for jQuery bug #5781 http://dev.jquery.com/ticket/5781
-			.css({ top: 0, left: 0 })
-			.position({
-				my: "left top",
-				at: "left bottom",
-				of: this.element,
-				collision: "none"
-			})
-			.data( "menu" );
+		this.menu.refresh();
+		this.menu.element.show();
 		if ( ul.width() <= this.element.width() ) {
 			ul.width( this.element.width() );
 		}
-		if ( $.fn.bgiframe ) {
-			ul.bgiframe();
-		}
 	},
 
 	_move: function( direction, event ) {
@@ -270,8 +266,7 @@ $.widget( "ui.autocomplete", {
 	},
 
 	widget: function() {
-		// return empty jQuery object when menu isn't initialized yet
-		return this.menu ? this.menu.element : $([]);
+		return this.menu.element;
 	}
 });
 
@@ -316,7 +311,12 @@ $.widget("ui.menu", {
 				e.preventDefault();
 				self.select();
 			});
-		var items = this.element.children("li")
+		this.refresh();
+	},
+	
+	refresh: function() {
+		// don't refresh list items that are already adapted
+		var items = this.element.children("li:not(.ui-menu-item)")
 			.addClass("ui-menu-item")
 			.attr("role", "menuitem");