diff options
| author | Scott González <scott.gonzalez@gmail.com> | 2011-01-10 22:47:30 -0500 |
|---|---|---|
| committer | Scott González <scott.gonzalez@gmail.com> | 2011-01-10 22:47:30 -0500 |
| commit | 723e0d6b6ebaecdf39a22aa204277cd630f79e93 (patch) | |
| tree | fbad2e7b490d08f274e58232ed0d6e6c62152848 /demos/autocomplete | |
| parent | da1517eda7a0fae012fbaa3676ea1b0bb449ae3e (diff) | |
| download | jquery-ui-723e0d6b6ebaecdf39a22aa204277cd630f79e93.tar.gz jquery-ui-723e0d6b6ebaecdf39a22aa204277cd630f79e93.zip | |
Autocomplete demo (combobox): Fixed tooltips and clearing of select on invalid entry.
Diffstat (limited to 'demos/autocomplete')
| -rw-r--r-- | demos/autocomplete/combobox.html | 28 |
1 files changed, 19 insertions, 9 deletions
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'> </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() { |