From 41f756f8b295b5d2435ca504b5d4972339c01f07 Mon Sep 17 00:00:00 2001 From: Jim Montgomery Date: Mon, 11 Jun 2012 18:46:57 -0700 Subject: [PATCH] make selecting of autocomplete items use each item's label instead of number to fix issue 8394 http://bugs.jqueryui.com/ticket/8394 >> When the autocomplete source uses a list of items that have different label and value pairs, as I interact with the autocomplete listing, the UI fills the selected field with the item.value instead of the desired item.label. For example, an item has the label: "apples", and the value: "123". When I walk through the options this item shows "123" in the UI instead of "apples". << --- ui/jquery.ui.autocomplete.js | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/ui/jquery.ui.autocomplete.js b/ui/jquery.ui.autocomplete.js index 2fb7e395cef..31d036c6ac0 100644 --- a/ui/jquery.ui.autocomplete.js +++ b/ui/jquery.ui.autocomplete.js @@ -238,10 +238,11 @@ $.widget( "ui.autocomplete", { // back compat for _renderItem using item.autocomplete, via #7810 // TODO remove the fallback, see #8156 var item = ui.item.data( "ui-autocomplete-item" ) || ui.item.data( "item.autocomplete" ); + var _label = item.label; if ( false !== this._trigger( "focus", event, { item: item } ) ) { // use value to match what will end up in the input, if it was a key event if ( event.originalEvent && /^key/.test( event.originalEvent.type ) ) { - this._value( item.value ); + this._value( _label ); } } else { // Normally the input is populated with the item's value as the @@ -249,7 +250,7 @@ $.widget( "ui.autocomplete", { // announce the item. Since the focus event was canceled, this doesn't // happen, so we update the live region so that screen readers can // still notice the change and announce it. - this.liveRegion.text( item.value ); + this.liveRegion.text( _label ); } }, menuselect: function( event, ui ) { @@ -272,7 +273,7 @@ $.widget( "ui.autocomplete", { } if ( false !== this._trigger( "select", event, { item: item } ) ) { - this._value( item.value ); + this._value( item.label ); } // reset the term after the select event // this allows custom select handling to work properly