Menu
Under iOS (currently 7.0), it looks like alert() and confirm() are not working when our web app is pinned to the home screen (aka using the meta tag apple-mobile-web-app-capable).
I found a user having a similar issue on twitter:
https://twitter.com/thomasfuchs/status/380137801259704320
Anybody has a temporary fix if it's really a bug in iOS 7?
693
We had a similar issue with alerts breaking our web app. The specific case was an alert which was triggered from the onchange of a select list. We put together a very simple test page like this:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <title></title> <meta name="description" content=""> <meta name="viewport" content="width=device-width"> </head> <body> <select onchange="alert('broken!');"> <option value="one">One</option> <option value="two">Two</option> </select> </body> </html> Running that page from Safari in an iPad and changing the select list triggers the alert then Safari freezes. You actually have to then close Safari. This affects Safari in general - your web app doesn't have to be pinned to the home screen. You should be able to test this on an iPad running iOS 7 on this test page http://jsbin.com/AGoTejA/1.
We have tested this on an iPad 2 (MC774B/A) and an iPad 3 (MD367B/A) and Safari crashes on both.
A hacky way to get around this is to use a setTimeout() to delay execution of the alert. The problem only seems to happen when Safari is trying to display the overlay which shows the select list items and an alert at the same time. confirm() is also broken in the same way.
161
The JavaScript alert() and confirm() bugs are fixed as of iOS 7.0.3.
45
I don't know if it is by design or a bug but I can confirm this is a real problem. One other thing to be aware of is that if the user has the option to save passwords enabled, any site that requires a login will fail because that prompt is also blocked. (you can try this with a simple form with a username and password box and nothing else and it simply won't submit). There are workarounds though for all three issues.
Login - set autocomplete="off" in the form tag for the site, or detect that the site is running IOS7 and in fullscreen mode and apply this setting
$('form').attr('autocomplete', 'off');
Alerts and Confirms - you can either write a custom function in JavaScript or override the existing functions in much the same way as here: http://andrewensley.com/2012/07/override-alert-with-jquery-ui-dialog/. I like using Eric Martin's SimpleModal plugin which has a built in Confirm override, the bottom demo on http://www.ericmmartin.com/projects/simplemodal-demos/.
I hope some of that helps.
22
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
