which is better way to load page content in jQuery mobile and Phonegap?

Question

I am building the iOS app use jQuery mobile and Phonegap. I build the website and test in PC browser,so I put the backend code(use Ruby) in the html file , so when jQuery load the page (use $.mobile.changePage()) the data will fetch from server and render the template file.(all file on the server).

But when I put codes in Phonegap, the index.html file will now on the local,is that my only way to fetch the server side data is to make a AJAX request to fetch the json and insert to the page?or any other way perform better?

And the jquery mobile use $.mobile.changePage() to change page using a AJAX request , so if I do make the request to fetch data , the $.mobile.changePage() function here only do the transition , because of it did not load any data for me.

Jasper Jasper · Accepted Answer · 2011-07-22T20:42:16

Ajax requests are a good way to go for loading remote content. If you want to load content when a page is shown do something like this:

$(document).delegate('[data-role="page"]', 'pageshow', function () {
    $.get('http://domain.com/path_to_script.php?id=blah', function (data) {
        $(this).children('[data-role="content"]').html(data);
    });
});

NOTE: this example expects that the non-local script will output html ready to insert into the dom. You can receive any type of data you would like and parse it however you would like; the data variable returns the response from the ajax request.

which is better way to load page content in jQuery mobile and Phonegap?

1 Answers