Search and Top Navigation
#6109 closed bug (fixed)
Opened September 24, 2010 04:24PM UTC
Closed September 24, 2010 08:50PM UTC
Last modified August 21, 2013 02:26PM UTC
Autocomplete Change event does not fire in IE
| Reported by: | Kryal | Owned by: | |
|---|---|---|---|
| Priority: | critical | Milestone: | 1.8.6 |
| Component: | ui.autocomplete | Version: | 1.8.5 |
| Keywords: | autocomplete change event mouse | Cc: | |
| Blocked by: | Blocking: |
Description
When using the mouse to select an item in the autocomplete menu, a resulting 'change' event does not occur (only tested in IE). This is because the focus.autocomplete event fires twice after an item has been selected.
So first, menu.select fires:
Always true because menu was just clicked therefore, menu has focus and not the input field.
if ( self.element[0] !== doc.activeElement ) {
self.element.focus(); Fires focus.autocomplete which sets previous
self.previous = previous; //Re-sets previous value after focus event
}
Nothing wrong here, except that the focus event fires again. This time, the event comes from the browser and not jQuery. So:
Script focus: sets previous (user-typed value)
Following script: Re-set prevous (expected to end here)
Browser focus: sets previous (which is now the selected value)
Therefore, when the blur event fires on the input field the code thinks that the value hasn't changed, and doesn't trigger the change event.
Attachments (0)
Change History (7)
Changed September 24, 2010 04:55PM UTC by comment:1
| milestone: | TBD → 1.9 |
|---|---|
| priority: | minor → critical |
Changed September 24, 2010 08:28PM UTC by comment:2
Replying to [comment:1 scott.gonzalez]:
Works in Chome, Firefox, Opera, IE9b.
It's actually broken in IE9b as well, not sure why I thought it was working there before
Changed September 24, 2010 08:30PM UTC by comment:3
The problem is that when we trigger the focus event on selection, IE ends up triggering a native focus event asynchronously. Because the second event occurs asynchronously, our attempt to override the value of the previous property occurs too early.
Changed September 24, 2010 08:50PM UTC by comment:4
| resolution: | → fixed |
|---|---|
| status: | new → closed |
Fixed in 0ccc786.
Changed October 25, 2010 06:52PM UTC by comment:5
| milestone: | 1.9 → 1.8.6 |
|---|
Changed November 19, 2010 06:26PM UTC by comment:6
Autocomplete: Handle IE firing focus events asynchronously. Fixes #6109 - Autocomplete Change event does not fire in IE.
Changeset: 0ccc78698b55d5e1bc336bb754b546a9ad19ea5c
Changed August 21, 2013 02:26PM UTC by comment:7
Hi, today I faced this problem (IE8) with the two focus events.
Problem (http://jsfiddle.net/vLq9E/16/):
1. Page with one autocomplete textbox and list of radio one radio group
2. Click any item from the list / selectmenu.
3. Immediately after that selection, click any radio option.
Listening to "change" event at autocomplete, sometimes, "change" was not triggered. That's due to the fact that "change", sometimes, is called before previous term is affected.
I solved it by adding "_delay" on autocomplete."_change" function, forcing it to be called later.
_change: function( event ) {
this._delay(function(){
if ( this.previous !== this._value() ) {
this._trigger( "change", event, { item: this.selectedItem } );
}
});
}
I don't know if it was the best solution, just reporting for your better analysis, since it can be a little tricky to reproduce.
Works in Chome, Firefox, Opera, IE9b.
Broken in IE6-8.