Please help, problem with iOS and jQuery Mobile select menu.

Please help, problem with iOS and jQuery Mobile select menu.

Hey guys,

I just recently started on jQuery mobile, and have been transitioning an iWebKit based site to it; so far, so good, except for one thing.

I have a page that allows the user to select a name, and it assigns phone numbers via javascript.  It works flawlessly in desktop browsers (Chrome, Safari), but when I try it on iOS, it breaks - selectedIndex of the select menu comes back undefined, regardless of what I choose.

Here's the code (numbers were stripped out for privacy).  Please help, thanks so much!

<!DOCTYPE html> 

<html>

<head>

<meta charset="UTF-8">

<meta name="viewport" content="height=device-height,width=device-width,initial-scale=1.0,maximum-scale=1.0" >

<title>UT HospMed</title>

<link href="css/jquery.mobile-1.3.0-rc.1.min.css" rel="stylesheet" type="text/css"/>

<script src="javascript/jquery-1.9.1.min.js" type="text/javascript"></script>

<script src="javascript/jquery.mobile-1.3.0-rc.1.min.js" type="text/javascript"></script>


<script>

function getnum(form1)

{var cellnum="0";

var pgnum="0";

var ind=form1.faculty.selectedIndex;

switch (ind) {

case 0:

cellnum="999-999-9999";

pgnum="999-999-9999"";

break;


}

pgnum=ind;

form1.cell.value=cellnum;

form1.pgnum.value=pgnum;


}


function callphone(form)

{

getnum (form);

window.open ('tel:'+form.cell.value,'_top')

}


function txtphone(form)

{

getnum (form);

window.open ('sms:'+form.cell.value,'_top')

}


function callpager(form)

{

getnum (form);

window.open ('tel:'+form.pgnum.value,'_top')

}


function txtpager(form)

{

getnum (form);

window.open ('http://www.myairmail.com/cgi-bin/myair_send/?gw_pin='+form.pgnum.value+"&mesg_to_send="+form.msgbod.value,'_top')

}

</script>

</head> 

<body> 

<form action="#" method="get" data-ajax="false">

<div data-role="page" id="home">

<div data-role="header" data-theme="b">

<h1>Faculty Contacts</h1>

</div>

<div data-role="content">

<div data-role="fieldcontain">

<label for="faculty" class="select">Faculty:</label>

<select name="faculty" id="faculty" onchange=getnum(this.form)>

<option value="0">Andre, Christine</option>

            <option value="1">Arevalo, Ted</option>

<option value="2">Bowling, Greg</option>

            <option value="3">Brzankalski, Gaby</option>

            <option value="4">Fishman, Barbara</option>

            <option value="5">Garcia, Sean</option>

            <option value="6">Hanson, Joshua</option>

            <option value="7">Hartzler, Anthony</option>

            <option value="8">Ho, Tony</option>

            <option value="9">Hsu, Sherwin</option>

            <option value="10">Johnson, Michael</option>

            <option value="11">Kraus, Mary (PA)</option>

            <option value="12">Leal, Crissy (PA)</option>

            <option value="13">Lee, Monica</option>

            <option value="14">Lopez, Reenie (PA)</option>

            <option value="15">Montana, Paula</option>

            <option value="16">Moreland, Chris</option>

            <option value="17">Owens, Aaron</option>

            <option value="18">Pao, Wen</option>

            <option value="19">O'rorke, Jane</option>

            <option value="20">Perkins, Wiley</option>

            <option value="21">Piwinski, Stephen</option>

            <option value="22">Poteet, Robyn</option>

            <option value="23">Schindler, Kevin</option>

            <option value="24">Schmit, David</option>

            <option value="25">Sehgal, Raj</option>

            <option value="26">Sprowls, Jennifer (PA)</option>

            <option value="27">Soni, Nilam</option>

            <option value="28">Velasquez, Sadie</option>

</select>


</div>


<li>Cell<span dir="rtl"><input placeholder="#" type="text"  readonly name="cell"/></span></li>

<li>Pager<span dir="rtl"><input placeholder="#" type="text" readonly name="pgnum"/></span></li>


<ul class="pageitem">

<li> <input name="Submit input" type="button" data-theme="b" onclick=callphone(this.form) value="Call Phone" /></li>

</ul><ul class="pageitem">

<li> <input name="Submit input" type="button" data-theme="b" onclick=callpager(this.form) value="Call Pager" /></li>

</ul><ul class="pageitem">

    <li> <input name="Submit input" type="button" data-theme="b" onclick=txtphone(this.form) value="Text Phone" /></li>

</ul><ul class="pageitem">

<li>Text Message<span dir="ltr"><input placeholder="Enter message here" type="text"  name="msgbod"/></span></li>

<li class="button"> <input name="Submit input" type="button" data-theme="b" onclick=txtpager(this.form) value="Text Pager" /></li>

</ul>

</div>


</form>

</body>


</html>