CODEWITHSUNDEEP
listviewjqueryjquery-mobile
Dan
Dan

Reputation: 101

jQuery Mobile trigger create needs delay

I am using Ajax to load an xml and shape it into a jQuery Mobile listview. Right after sending the xml i am calling the trigger method so that the page can be re-initialized and the css styles can be added to the listview like so:

xmlhttp.send();
$("#page1").trigger( "create" );

When i load the page, i see the styles on the listview for a fraction of a second but then the listview shows up without the jQuery Mobile styles. It seems to work when i use a delay though like so:

setTimeout(function(){
    $("#page1").trigger( "create" );
}, 5);

I noticed this as it always seemed to work when i used a breakpoint. This bothers me though, because when i use this method i always see the unthemed list for a short while. I also tried refreshing the list right before and after creation but none seemed to work. Does anyone know a way to fix this issue?

Upvotes: 0

Views: 411

Answers (1)

Jasper
Jasper

Reputation: 76003

AJAX requests are asynchronous, meaning other code runs while the response is being waited-on. The general flow for using an AJAX request is to do any work on the data received in a callback function for the request. Here is an example using jQuery AJAX:

$.ajax({
    url     : 'my-page.html',
    success : function (response) {
        $("#page1").html(response).trigger('create');
    },
    error   : function (jqXHR, textStatus, errorThrown) { /*remember to handle errors*/ }
});

This assumes that the server-response is valid HTML and that you wanted to replace the content of #page1 with the response from the server.

Upvotes: 1

Related Questions