jQuery Mobile: Dynamic content not loading when I return to a page -
my data getmovies.php working correctly , loading #moviespage first time load page. however, if navigate away #moviespage , return content not reload. header , footer appear , can see unpopulated <ul> there, not of dynamically loaded <li>s.
my code below. any thoughts on how can dynamic data load when return page?
$( '#moviespage' ).live( 'pagebeforecreate',function(event){ getmovieslist(); }); function getmovieslist() { $.getjson(serviceurl + 'getmovies.php', function(data) { $('#movieslist li').remove(); movies = data.items; $.each(movies, function(index, movie) { $('#movieslist').append('<li>' + '<img src="posters' + movie.poster + '"/>' + '<div class="movie-toprow"><h4>' + movie.title + '</h4>' + '</li>').listview('refresh'); }); }); } i'm using jquery mobile 1.1.0-rc.1, having same issue 1.0.1. mobile app used on ios, android, , other mobile platforms.
bonus: want content reload. however, cache title , movie poster image each unique movieid, still pull dynamic data in each <li> (i removed other data simplify code question). i'm not familiar caching, know how load both new data , cached data when page revisited. know use localstorage or sessionstorage title, how make easy image reloaded without making request server?
thank insight can share on primary or bonus question! -mark
to move cached page use #moviespage method, instead of index.html use page id #index or #profile
-- comments
Comments
Post a Comment