jQuery Mobile 2-page Base Fiddle
HTML
<script src="http://code.jquery.com/mobile/latest/jquery.mobile.min.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/mobile/latest/jquery.mobile.min.css">
<div data-role="page" id="p1">
<div data-role="header"><h1>Header Page 1</h1></div>
<div data-role="content">
<select name="aS" id="aS" data-native-menu="false">
<option value="1">foo</option>
<option value="1">baar</option>
<option value="1">do</option>
</select>
</div>
<div data-role="footer"><h4>Footer</h4></div>
</div>
JavaScript
//$(document).delegate('#p1', 'pageshow', function () {
$(document).ready(function(){
$("#aS").change(function(){
alert('going to change');
getAjax('',{},function(){
alert('got callback');
});
});
});
function getAjax(request,datain,callback){
$.mobile.showPageLoadingMsg();
$.ajax({
type: "POST",
url: 'http://open.live.bbc.co.uk/wurfldemi/network.jsonp?callback=?'+request,
// async: false,
data: datain,
beforeSend: function(x) {
if(x && x.overrideMimeType) {
x.overrideMimeType("application/j-son;charset=UTF-8");
}
},
dataType: "jsonp",
success: function(data){
$.mobile.hidePageLoadingMsg();
callback(data);
},
error: function (xhr, ajaxOptions, thrownError) {
$.mobile.hidePageLoadingMsg();
alert(xhr.status);
alert(thrownError);
}
});
return false;
}