CODEWITHSUNDEEP
javascriptjquerycsslistviewjquery-mobile
Walter Gandarella
Walter Gandarella

Reputation: 107

dynamic listview not being styled by jQuery Mobile

I'm bringing external data via JSON for my app. The loading of data is OK. The problem is when I display this data. I have this page:

<!-- cinema -->
<div data-role="page" id="cinema">
    <div data-role="header">
        <h1>WGBN Cinema Salvador</h1>
    </div><!-- /header -->

    <div data-role="content">
        <ul data-role="listview" data-inset="true" data-divider-theme="d" id="programa">

        </ul>
    </div>
</div>

and this javascript to this page:

$(document).delegate("#cinema", "pageinit", function(data) {
        // loop nas salas
        $.each($.objCinema, function(key,value) {
            $("#programa").append('<li data-role="list-divider">'+value.sala+'</li>').trigger('create');
            $.each(value.filmes, function(a,b) {
                $.each(b, function(c,d) {
                    $("#programa").append('<li>'+d+'</li>').trigger('create');
                });
            });
        });
    });

And even using .trigger("create") elements inserted in the page are not being styled by jQuery Mobile, I'm doing something wrong?

Upvotes: 0

Views: 2544

Answers (1)

Ross
Ross

Reputation: 3330

Try this -

$("#programa").listview("refresh");

/edit

I forgot to mention to try this listview refresh after your inner for each loop.

Upvotes: 6

Related Questions