Here is all the code I've tried:
select:function(event, ui) {
window.open(ui.item.value, "_blank");
}
select:function(event, ui) {
window.location.href = ui.item.value;
}
When in web app mode, the screen just refreshes, it doesn't go to the location. In Mobile Safari, it works as intended.
Is this a limiting with web apps on iPhone? Is there a way around it?
Here is the complete code:
<script>
$(document).ready(function() {
var cct = $('input[name=csrf_token]').val();
var searchInput = $('input[name=search]');
function loadEventsData(onSuccess){
$.ajax({
type: 'POST',
url: '<?php echo site_url('ajax_frontend/getEventsSearch'); ?>',
dataType: 'json',
success: onSuccess,
error: function(XMLHttpRequest, textStatus, errorThrown) { alert(errorThrown); }
});
}
function initializeEventsAutocomplete(data){
searchInput.addClass('loaded').autocomplete({
source:data,
appendTo: '.search_autocomplete',
minLength:2,
delay:0,
selectFirst:false,
open: function(event, ui) {
$('ul.events').hide();
$('.ui-autocomplete').removeAttr('style');
$('.icon-search').hide();
$('.icon-close').show();
},
close: function(event, ui) {
val = searchInput.val();
searchInput.autocomplete("search", val);
searchInput.focus();
return false;
},
select:function(event, ui) {
window.location.href = ui.item.value;
return false;
}
});
}
$('form').submit(function(e) {
e.preventDefault();
searchInput.blur();
});
searchInput.keyup(function(){
if($(this).is(".loaded")) return;
loadEventsData(initializeEventsAutocomplete);
});
$('.icon-close').click(function(e) {
e.preventDefault();
$(this).hide();
$('.icon-search').show();
searchInput.autocomplete('close');
$('ul.events').show();
searchInput.val('');
});
});
</script>
And here is the JSON (some of it):
[{"value":"http:\/\/events.dev\/index.php\/event\/canada-day","label":"Canada Day"},{"value":"http:\/\/events.dev\/index.php\/event\/triathlon-festival","label":"Triathlon Festival"}]
Programmatically (Javascript) opens a link in Mobile Safari. Ideal if you cannot use a standard html link but you must use Javascript:
var a = document.createElement("a");
a.setAttribute('href', facebook);
a.setAttribute('target', '_blank');
a.click();
I figured this out. I'm using the following code to prevent links in the web app from opening in Safari:
https://gist.github.com/1042026
This was causing some unwanted side effects. To fix this, I added:
event.stopPropagation();
to my selection:function
area and it works as it should.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With