Question

I am building a mobile app using Jquery mobile. It´s a multi-page app all included in the same index.html. The app gets its data from an external source via AJAX request. When loading the first time the app, the pageinit event on the home page loads all external info and changes the DOM. On one of the multiple pages, I included a button that on click fetches from a second URL some modified external data, but the data on my pages are not updated. Is there a caching problem with Jquery mobile?

Code:
<script>
$('#pageHome' ).live('pageinit',function(event){             
  getInfo(serviceURL1);                                       
});

function getInfo(serviceURL) {  
$.ajax({  
   url: serviceURL,  
   dataType:'json', 
   timeout:20000,  
   type:'POST',  
   success:function(json, status) {

   $('#page1' ).live('pageinit',function(event){ 
      append info to page1
   });

   $('#page2' ).live('pageinit',function(event){ 
      append info to page2
   });                  
});      
}

function getUpdate() {
 geInfo(serviceURL2);
}
</script>

Answer 1

this could help you

$(document).ready(function(){
   jQuery.ajaxSetup({
             // Disable caching of AJAX responses 
                 cache: false
             });
 });

you also should use fiddler (www.fiddler2.com) for analyzing the traffic and http requests

cheers