From 723e0d6b6ebaecdf39a22aa204277cd630f79e93 Mon Sep 17 00:00:00 2001
From: Scott González <scott.gonzalez@gmail.com>
Date: Mon, 10 Jan 2011 22:47:30 -0500
Subject: Autocomplete demo (combobox): Fixed tooltips and clearing of select
 on invalid entry.

---
 demos/autocomplete/combobox.html | 28 +++++++++++++++++++---------
 1 file changed, 19 insertions(+), 9 deletions(-)

(limited to 'demos/autocomplete/combobox.html')

diff --git a/demos/autocomplete/combobox.html b/demos/autocomplete/combobox.html
index fd373f0e4..598a7cc27 100644
--- a/demos/autocomplete/combobox.html
+++ b/demos/autocomplete/combobox.html
@@ -29,6 +29,7 @@
 				var input = this.input = $( "<input>" )
 					.insertAfter( select )
 					.val( value )
+					.attr( "title", "" )
 					.autocomplete({
 						delay: 0,
 						minLength: 0,
@@ -57,7 +58,8 @@
 						},
 						change: function( event, ui ) {
 							if ( !ui.item ) {
-								var matcher = new RegExp( "^" + $.ui.autocomplete.escapeRegex( $(this).val() ) + "$", "i" ),
+								var value = $( this ).val(),
+									matcher = new RegExp( "^" + $.ui.autocomplete.escapeRegex( value ) + "$", "i" ),
 									valid = false;
 								select.children( "option" ).each(function() {
 									if ( $( this ).text().match( matcher ) ) {
@@ -67,8 +69,12 @@
 								});
 								if ( !valid ) {
 									// remove invalid value, as it didn't match anything
-									$(this).val( "").attr( "title", value + " didn't match any item" ).tooltip( "open" );
-									setTimeout( function() {
+									$( this )
+										.val( "" )
+										.attr( "title", value + " didn't match any item" )
+										.tooltip( "open" );
+									select.val( "" );
+									setTimeout(function() {
 										input.tooltip( "close" ).attr( "title", "" );
 									}, 2500 );
 									input.data( "autocomplete" ).term = "";
@@ -89,6 +95,7 @@
 				this.button = $( "<button type='button'>&nbsp;</button>" )
 					.attr( "tabIndex", -1 )
 					.attr( "title", "Show All Items" )
+					.tooltip()
 					.insertAfter( input )
 					.button({
 						icons: {
@@ -109,12 +116,15 @@
 						input.autocomplete( "search", "" );
 						input.focus();
 					});
-					
-					input.tooltip( {
-						position: {
-						  offset: (this.button.width() + 5) + " 0"
-						}
-					}).tooltip( "widget" ).addClass( "ui-state-highlight" );
+
+					input
+						.tooltip({
+							position: {
+								of: this.button
+							}
+						})
+						.tooltip( "widget" )
+							.addClass( "ui-state-highlight" );
 			},
 
 			destroy: function() {
-- 
cgit v1.2.3