asked on

iOS 7 onchange event is broken in iPad 3+Mini // Need work around

Please test this only on iPad running ios 7

It appears that iOS 7 doesn't support alert() and confirm() for onchange events on iPad. Strange thing is that it works on iPhone 4s running ios 7.0 and in desktop browser but not on ipad 3 or ipad mini running ios 7.0. It fires the dialog and when clicked it darkens the button (as if it was clicked) and then the browser freezes. Happens in both Safari and chrome running on iOS 7 iPad and iPad mini.

Any pointers would be greatly appreciated. Already tried onblur and onkeypress with no success :-/

Options
<select id="iCard" onchange="alert('It worked.')">
    <option value="0" selected="selected">(none)</option>
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
    <option value="3">Option 3</option>
    <option value="4">Option 4</option>
</select>

Open in new window

Issue can be seen here (make sure to test it on iPad running iOS 7): http://jsfiddle.net/sethsanders/MvSxm/

Michel Plungjan

Can you try

<select id="iCard" onchange="document.getElementById('msg').innerHTML='It worked.';">
    <option value="0" selected="selected">(none)</option>
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
    <option value="3">Option 3</option>
    <option value="4">Option 4</option>
</select>
<span id="msg"></span>

Open in new window

instead?

Kim Walker

The standards compliant method would be to tell it what script engine to use and end with a semi-colon. Maybe the iPad is picky.

Options
<select id="iCard" onchange="javascript: alert('It worked.');">
    <option value="0" selected="selected">(none)</option>
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
    <option value="3">Option 3</option>
    <option value="4">Option 4</option>
</select>

Open in new window

Michel Plungjan

No way. The semicolon is only EVER needed in event handlers to SEPARATE statements

Kim Walker

One more thing that might help a picky browser would be to return true at the end.

Options
<select id="iCard" onchange="javascript: alert('It worked.');return true;">
    <option value="0" selected="selected">(none)</option>
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
    <option value="3">Option 3</option>
    <option value="4">Option 4</option>
</select>

Open in new window

Michel Plungjan

@xmediaman Are you guessing here?

1) javascript: pseudo protocol/label is ONLY EVER needed in IE if there is a VBScript at the top of the page
2) return true is only needed in a very few handlers, the only ones I can think of is onmouseover/out when you change the status line (no longer allowed in most browsers) and in any handler that returns EITHER true OR false such as a submit handler with a validation.

Kim Walker

Absolutely. Obviously iOS7 on the iPad 3 isn't behaving normally so I'm making suggestions that might work. I don't have anything to test on. After all, who'd of ever thought that adding and empty onclick attribute on a label tag would overcome previous iOS issues. But it works.

Michel Plungjan

Perhaps it is because your fiddle is running onload, which creates this code where the function is not in the window scope

<script type='text/javascript'>
window.onload=function(){
function SetCard(cVal, cTxt) {
    alert('SetCard called successfully.')
}
</script>

Open in new window

Please try this version where I load the function in the head instead

JSFiddle

I will test on iPad 3 iOS7 in a few hours - it works on my 4S iOs7

SethSanders

ASKER

I tested all of the above possible solutions and none of them have worked so far :-/

@mplungjan: My original fiddle code ran no problem on my 4s running iOS7 as well. This is really baffling.

Michel Plungjan

I can confirm this case with iPad 3 iOs7
I raised bug #15067555 with apple.

ASKER CERTIFIED SOLUTION

Michel Plungjan

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

SethSanders

ASKER

Thanks mplungjan! That works!

Michel Plungjan

Thanks a LOT Apple!

Apple Developer Relations22-Oct-2013 01:43 AM

Engineering has determined that your bug report is a duplicate of another issue and will be closed.

---

but I cannot see the closed issue