I’m tearing my hair out over this issue. I have javascript code that looks like this:
<script type=text/javascript>
function readVals(){
val1 = $('#select1').val()
val2 = $('#select2').val()
val3 = etc.
}
</script>
<select id='select1'>
<option value='val1'>val1</option>
<option value='val2'>val2</option>
</select>
<select id='select2'>
<option...
The readVals method works just fine when running from a desktop, tested on Firefox, Chrome, Safari and from Mac, Ubuntu and Windows. However, from Android and iPhone, regardless of mobile browser, $(‘#select2’).val() always returns 0. What’s more bizarre is that I constructed another test function like this:
function getVal2(){
alert($('#select2').val())
}
getVal2() is declared right before readVals(), in the <head> of the page and it alerts the correct value, even on mobile devices. So I run getVal2() and see the right value. Then I run readVals() immediately after and get the wrong value, but only for val2, and only on mobile devices, but on any mobile browser.
Any ideas?
OMG, I just realized what the issue was. As soon as added
varto make it local:then the problem went away, but it just occurred to me why the issue was only on mobile devices: I simplified and shortened my code to ask the question, but the actual name of the variable was
orientation, which I’m guessing is used by mobile devices to describe how the device has been rotated. That explains why the values coming in from mobile devices were 0 and 90 (as in degrees). Stupid stupid stupid. Well that only took three days to figure out. Sorry for wasting your time. Next time I will post the actual code.