Take a look at my code: http://jsfiddle.net/WqssQ/
When you click check in, it pops up with a listview in a dialog page. If you dismiss this, then click check in again, the listview isn't formatted properly.
I have tried:
$('#location_listview').listview('refresh');
As suggested, but this doesn't work.
Before refresh the listview you have to wait until its initialization. Try with this:
$( "#location_popup" ).one( "pagebeforeshow", function( event ) {
$('#location_listview').listview('refresh');
});
Demo here.
I think you have to put the li in the html code instead of append it with jquery. Have a look to this new fiddle : http://jsfiddle.net/lulu3030/WqssQ/1/
$.mobile.changePage("#location_popup", {
transition: "fade",
role: "dialog",
reverse: false
});
$('#location_listview').listview('refresh'); // The positioning of location_listview resolved the issue
Check my solution on jsfiddle. http://jsfiddle.net/WqssQ/20/
$('#get_places').click(function () {
onSuccess();
});
function onSuccess() {
$('#location_listview').html("");
for (var i = 0; i < 7; i++) {
$('#location_listview').append("<li><a href=#main>" + i + "</a></li>");
}
$.mobile.changePage("#location_popup", {
transition: "fade",
role: "dialog",
reverse: false
});
**$('#location_listview').listview('refresh');**
}
