iOS Guided Access mode breaks HTML <select> - ios

I have a web site built as a web app that contains a single 'select' menu. The menu works fine and the options are displayed when viewed in a browser including Mobile Safari on an iPad.
However viewing the web app with Guided Mode enabled (http://support.apple.com/kb/HT5509?viewlocale=en_US&locale=en_US) which prevents access to some iPad features, the tag stops working and won't open. A regular link using the 'a href' tag still works though.
Does anyone know why this particular tag is not working?

I've run into this same issue. It appears to be an iOS bug.
jQuery Mobile had a bug reported for this issue here: https://github.com/jquery/jquery-mobile/issues/6806
They solved it by coding around it, using hidden divs that are enabled by Javascript (See their custom select menu examples).

Related

IOS 14.7.1 and WordPress Drop Down

I am supporting a website that has a drop down menu (1800sweeper.com) and it was brought to my attention that the dropdown menu for the states on the front page does not work on iOS 14.7.1 so I am testing with an emulator and I tried this setting safari to block cookies and the drop down works but when I set to unblock cookies the dropdown does not direct me to the page in question it does nothing. This works perfectly fine in Chrome, so I am curious if this may be device specific as it does not make much sense that it works when I block cookies?

Mobile browser crashes when loading page

Recently we found problems that sometimes our webpage crashes on iOS. Its happening both in Chrome and Safari. Has anyone idea how to debug it, or why its happens ?
Its hard to reproduce (actually on some phone we were not able to). So we are trying turning off some components from the page. The page contains lot of HTML (20-100 pages) and some bit heavy javascript components, such as maps, street view or even graphs.
Thanks for any idea or hint. Thanks!
You can debug the webpage, when it is loading on your mobile browser(Safari).
Follow the below steps:
Connect your iOS device to MAC--> open Safari on MAC --> In the menu bar you can see Develop option --> On selecting the develop option it will show all the connected devices--> keep the menu popup open and browse your webpage on the connected iOS device.
Note : If your device doesn't show up in the develop option please enable it in iOS device settings --> Safari --> advanced --> Web Inspector.

How to view javascript errors in ios simulator launced by phonegap?

I can't seem to find an answer to this seemingly simple question. I have an app that i've built using the command line phonegap tools and when i start this app it opens up. i am using something called ios_sim (https://github.com/phonegap/ios-sim) which launches the app in the simulator and does not launch xCode (i don't quite understand why this is a feature, it seems like xCode has some useful tools)
Anyhow, my app is not functioning the same way that it does in the browser and i need to debug it. I have also already installed Charles to inspect the requests and i can verify that the correct data is coming from my API so my assumption is that there is some sort of javascript error in rendering the page (the page is partially rendered btw).
All i want to do is view the javascript errors. the same way that you would in the console if you were looking at a web page.
how do you do that?
You have to use Safari Remote Debugging with Web Inspector. See in the relating cordova docs how to do that!

IOS Web App open links within web app

I am in the mist of creating a mobile web app and have both meta tags
I have an iphone 5 on 7.0.4
When I click on a regular link like the one below it, opens up a mobile safari window and leaves the webapp. I also tried setting the target to _self and same behavior.
Sign in
I then used my ipad which was on 7.0.3 and it worked as should, not opening mobile safari on links. I think proceeded to update my ipad to 7.0.4 and the same issue as I had on my ipad.
Anyone ran into this issue and or knows a fix ?
Thanks
Since iOS 7.0.4 all links in WebApps open in Safari. As a workaround you can use Javascript:
window.location.href='text.html'
But remember that these steps will not be captured in history (so there is no ability to use Javascript like history.back() ..).
Alternatively, if you are using a menu in your web app, try to combine iframe and Javascript, you can change the content of your iframe with this Javascipt:
document.getElementById("frame").src = new_content.html
This will prevent your WebApp to open up links in Safari and stay in WebApp view.

Page Renders in Safari but not in Chrome on iPad

Versions:
PC OS: Windows 8
iPad OS: iOS 7.0.2 (11A5901)
Chrome: 30.0.1599.16
ExtJS 3.4.0
Problem:
I have a web application that relies heavily on Javascript (using the ExtJS framework). It all seems to work as I expect except one page. When browsing this page on my iPad using Safari, the page renders correctly. When in Chrome, I only get the part of the page that doesn't need javascript. However, if I click on the chrome menu and request desktop site then the page loads as intended.
Things I have tried / searched for:
How to debug this page in Chrome on the iPad. All the articles are either old or say to use Safari (because Chrome and Safari use the same engine?), but the page works in Safari.
Setting the agent string in my desktop version of Chrome. The page still loaded correctly.
I turned off Javascript in Safari (just to see). Safari then behaved like Chrome.
I'm just looking for a direction to go or something to try. I'm pretty new when it comes to iPad development. But I think that if I could just see what the developer tools show, I can work it out from there. I can't post a link because the site is behind a login.
Any help is appreciated!
One approach might be to load Firebug Lite on your page. This would allow you to log errors and print JavaScript values to the console.

Resources