jquery mobile load page and get data

Question

I get in trouble when calling the page using jquery mobile. In this example I assume if the index page (index.html) will call the data page(data.html) that will contain the data from my server. On my case, when I do the calling page from index.html using the syntax :

$.mobile.changePage("data.html");

And on page data.html I made this sintax :

$(document).on('pageinit', '#myDataPage', function(){    
    GetData();
});

function GetData(){
   //Ajax Function here
}

After I call data.html apparently no data is displayed. But if I do it manually refresh the page turns data taken from my server successfully displayed. Is there something wrong with my code?

Community · Accepted Answer · 2017-05-23 11:43:19Z

1

By default jQuery Mobile uses Ajax to perform pages transitions. This means that during the transition jQuery Mobile will only inject the contents of the response's body element (or more specifically the data-role="page" element, if it's provided), meaning nothing in the head of the page will be used (with the exception of the page title, which is fetched specifically).

So any scripts and styles referenced in the head of a page won't have any effect when a page is loaded via Ajax, but they will execute if the page is requested normally via HTTP.

If you move your script from the head tag inside the second page's div (<div data-role="page" id="myDataPage">), it will execute. Another way is to create a JS file and load your JavaScript on the first page's load (relevant example here).

I hope this helps.

edited May 23, 2017 at 11:43

CommunityBot

11 silver badge

answered Apr 27, 2013 at 10:19

Apostolos Emmanouilidis

7,2091 gold badge27 silver badges35 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

jquery mobile load page and get data

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related