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