jQuery UI autocomplete needs double tap on iOS

Question

I am using jQuery UI autocomplete (the default functionality), but I am facing a problem in iOS - I need to tap two times to select an option. I am using it with Bootstrap inside a modal window. Is there any solution for this?

Answer 1

I have the same problem solved it by using the Focus event. First detect that they are on a touch device. You can expand on the user agents below for a more complete list.

And then doing whatever you are doing inside the select event. This will redirect them with one tap.

   focus: function (event, ui) {
   if (navigator.userAgent.match(/(iPod|iPhone|iPad)/)) {
       window.location.href = ui.item.url;
   } else{
     $('#SearchTerm').val(ui.item.label)
   }
}