SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Member
    Join Date
    Dec 2013
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Jquery Mobile and JSON

    Good evening everybody!
    I need hel to understand a weird enviroment of my web app.

    I'm trying to create an app with Phonegap and Jquery mobile.
    I have a problem with the refresh of the listview. I download data from JSON and create a list of elements.

    The list it isn't correctly downloaded but if I refresh the browser I see it correctly.

    What's the problem?

    Next you can see the HTML and Javascript pages.

    HTML page

    Code:
    <!DOCTYPE HTML>
        <html>
        <head>
        <title>CATEGORIA THRILLER</title>
        <meta name="viewport" content="width=device-width,initial-scale=1"/>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    
            <link rel="stylesheet" href="css/jquery.mobile-1.3.2.min.css" />
            <link rel="stylesheet" href="css/jquery.mobile-1.3.2.css" />
            <script src="js/jquery-1.10.2.js"></script>
            <script src="js/jquery.mobile-1.3.2.js"></script>
        </head>
        <body>
        <div id="thrillerListPage" data-role="page" data-theme="a">
    
            <div data-role="header" data-position="fixed" data-theme="a">
                <a href="index.html" data-icon="home" data-iconpos="notext"></a>
                <h1>THRILLER</h1>
            </div>
            <div data-role="content" data-theme="a">
                <ul id="thrillerList" data-role="listview" data-filter="true" data-filter-placeholder="Cerca libro/autore..." data-theme="a"></ul>
            </div>       
        </div>
        <script src="js/libri-list.js"></script>
        <script src="js/libri-details.js"></script>
    
        </body>
        </html>
    JS

    Code:
    var serviceURL = "/services/";
        var employees;
    
        $(document).ready (function() {
        getThrillerList();
        });
    
        $(document).delegate('#thrillerListPage','pageshow', function(event) {   
             getThrillerList();
        });
        $('#thrillerListPage').bind('pageinit', function(event) {
            getThrillerList();
        });
    
        function getThrillerList() {
            $.getJSON(serviceURL + 'get-lista-libri-thriller.php', function(data) {
                $('#thrillerList li').remove();
                employees = data.items;
    
                $.each(employees, function(index, employee) {
                    $('#thrillerList').append('<li><a href="libri-details.html?id=' + employee.id + '">' +
                            '<img src="employee.img + '" width="58px" height="80px" />' +
                            '<h4>' + employee.title + '</h4>' +
                            '<p>' + employee.info1 + '</p>' +
                            '</a></li>');
                });
                $('#thrillerList').listview('refresh');
            });
        }
    Hope somebody can help me!

    Thank you!

  2. #2
    SitePoint Member
    Join Date
    Feb 2014
    Posts
    12
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Code:
    function getThrillerList() {
      
    $.getJSON(serviceURL + 'get-lista-libri-thriller.php', function(data) {
        $('#thrillerList li').remove();
        employees = data.items;
        $.each(employees, function(index, employee) {
            $('#thrillerList').append('<li><a href="libri-details.html?id=' + employee.id + '"><img src="'+employee.img + '" width="58px" height="80px" /><h4>' + employee.title + '</h4><p>' + employee.info1 + '</p></a></li>');
    
        });
        $('#thrillerList').trigger('create');
        $('#thrillerList').listview('refresh');
      });
    }


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •