Просмотр списка jquery-mobile -> Обновить события

Question

Я видел несколько таких постов, похожих на это, поэтому я извиняюсь заранее, если это дубликат.

У меня есть этот код при извлечении некоторых данных, но я не могу показатьсячтобы выяснить, почему мой список не обновляется ... Какие-нибудь возможные решения?Это мой JS.

/* VARIABLES
-------------------------------------------------------------------- */
var serviceUrl = "http://localhost/app/services/";
var serviceToLoad = "homeList.php";

var home;
var pageId    = "#homePage";
var contentId = "#homeList";


/* JQUERY
-------------------------------------------------------------------- */
$(pageId).live('pageshow', function(event){
    getHomeList();
});


/* FUNCTION SET
-------------------------------------------------------------------- */
function getHomeList() {

    $.getJSON(serviceUrl + serviceToLoad, function(data) {

        // Remove all content first
        $(contentId +' li').remove();

        // Load Data
        $.each(data.items, function(index, list){
            $(contentId).append('<li><a href="#">' + list.name + '</a></li>\n');
        });

    });

    // Reload View
    $(contentId).listview('refresh');
}

И это моя HTML-страница

<div id="homePage" data-role="page" >
    <div data-role="header" data-position="fixed"><h1>Home</h1></div>

    <div data-role="content">
         <ul id="homeList" data-role="listview"></ul>
    </div>
</div>

Любая помощь будет принята с благодарностью!

Answer 1

Ajax-вызов асинхронный , поэтому поместите список обновления в jSON-вызов!

/* VARIABLES
-------------------------------------------------------------------- */
var serviceUrl = "http://localhost/app/services/";
var serviceToLoad = "homeList.php";

var home;
var pageId    = "#homePage";
var contentId = "#homeList";


/* JQUERY
-------------------------------------------------------------------- */
$(pageId).live('pageshow', function(event){
    getHomeList();
});


/* FUNCTION SET
-------------------------------------------------------------------- */
function getHomeList() {

$.getJSON(serviceUrl + serviceToLoad, function(data) {

    // Remove all content first
    $(contentId +' li').remove();

    // Load Data
    $.each(data.items, function(index, list){
        $(contentId).append('<li><a href="#">' + list.name + '</a></li>\n');
    });

    // Reload View
   $(contentId).listview('refresh')
});
}

Answer 2

После добавления строк в список выполните

var contentDiv=$(".ui-page-active div[data-role*='content'] ul");
contentDiv.listview("refresh");

Answer 3

try this $ (contentId) .listview ('refresh', true);,И обязательно позвоните .listview по элементу ul