Search and Top Navigation
#10544 open bug ()
Opened August 13, 2014 01:45PM UTC
Last modified March 27, 2017 03:32PM UTC
Autocomplete: Must click two times to select an item in iOS
| Reported by: | Humpa | Owned by: | |
|---|---|---|---|
| Priority: | minor | Milestone: | none |
| Component: | ui.autocomplete | Version: | 1.11.0 |
| Keywords: | Cc: | ||
| Blocked by: | Blocking: |
Description
First click on an item only sets class "ui-state-focus". Must click it again to actually select it.
This worked in version 1.10.0
A strange behavious is that in some cases the exact same code works:
- JSFiddle edit view (works): http://jsfiddle.net/35rmk2p6/4/
- The same JSFiddle, but now only the html view (does not work): http://jsfiddle.net/35rmk2p6/4/show
Bug reproduced on iPhone and iPad Mini with iOS 7
Attachments (0)
Change History (7)
Changed August 13, 2014 06:27PM UTC by comment:1
| status: | new → open |
|---|---|
| summary: | Most click two times to select an item in iOS → Autocomplete: Must click two times to select an item in iOS |
Changed August 14, 2014 08:33AM UTC by comment:2
Normally, for iOS, you should be able to put the style
{cursor: pointer} or attribute onclick=""on a non <a href="url"> element and it should send a click. But even that seems to not work here.
Changed February 23, 2015 03:16PM UTC by comment:4
Replying to [comment:3 scott.gonzalez]:
#11193 is a duplicate of this ticket.
Two thing of interest from this duplicate:
1. This bug is also on iOS 8.1
2. The theory that it works inside an iframe is supported by the fact that it works in jsfiddle edit view, but not in show view.
Changed September 09, 2015 02:57PM UTC by comment:5
I can confirm this bug. Been investigating it for a full day on one of our projects. :)
If you want another reduced testcase that shows the difference in behavior between iframe (click works) and no iframe (click doesn't work), you only have to look at:
http://jqueryui.com/autocomplete/
and
http://jqueryui.com/resources/demos/autocomplete/default.html
I spent most of the day looking for a bug in our own code, because I originally tested on the main demo page (iframe), and it worked, so I had ruled out jQuery UI Autocomplete as a culprit.
People discussing hacky fixes:
Changed August 04, 2016 10:10AM UTC by comment:6
I can confirm this bug on iPad with iOS 9.3.3. But the bug goes away if I comment out the following line in autocomplete's menufocus handler.
$( "<div>" ).text( label ).appendTo( this.liveRegion );
But I don't know what's wrong with that line.
Changed March 27, 2017 03:32PM UTC by comment:7
I think I found out why that line is causing this. According to https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariWebContent/HandlingEvents/HandlingEvents.html, iOS is first sending mouseover and mousemove events and then only sending a click event if the page's content doesn't change after the mousemove.
The menufocus event happens after mousing over the autocomplete's menu item, and that line in the handler adds content to the page, so no click event happens. I tried delaying changing the liveRegion and that seems to work.
Confirmed and reduced: http://jsfiddle.net/tj_vantoll/35rmk2p6/5/.
The same behavior does not occur on Android. Very odd.