jQuery Mobile 2-page Base Fiddle

HTML

<!DOCTYPE html>
<html>
<head>
    <title>jQM Complex Demo</title>
    <meta name="viewport" content="width=device-width"/>
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
    <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>    
</head>
<body>
    <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> 
</body>
</html>

JavaScript

$(document).on('pagebeforeshow', '#p1', function(){   
    $(document).on('change', '#aS', function(event, ui){          
            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;
}