Jquery Mobile и JSON

Question

Jquery Mobile и JSON

0

Мне нужна помощь, чтобы понять странную среду моего веб-приложения.

Я пытаюсь создать приложение с Phonegap и jQuery mobile. У меня проблема с обновлением списка. Я загружаю данные из JSON и создаю список элементов.

Список неправильно загружен/оформлен, но если я обновляю браузер, я вижу его правильно.

В чем проблема?

Затем вы можете увидеть страницы HTML и Javascript.

HTML

<!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-theme="a"></ul>
    </div>       
</div>
<script src="js/libri-list.js"></script>
<script src="js/libri-details.js"></script>

</body>
</html>

JS

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');
    });
}

Надеюсь, кто-нибудь может мне помочь!

Спасибо!

Prova17 15 дек. 2013, в 16:20

Источник

0

почему вы загружаете jquery.mobile-1.3.2.css и mobile-1.3.2.min.css ?
Omar 16 дек. 2013, в 12:13
0

Здесь одна ошибка JavaScript в вашем # thrillerList.append (). Смотрите обновленный код ниже
Ved 16 дек. 2013, в 14:04

Теги:

jquery

android

json

cordova

jquery-mobile

1 ответ

Ещё вопросы

почему вы загружаете jquery.mobile-1.3.2.css и mobile-1.3.2.min.css ?
Здесь одна ошибка JavaScript в вашем # thrillerList.append (). Смотрите обновленный код ниже

Ved · Answer 1 · 2013-12-16T12-34-00.000Z

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');
  });
}

Спасибо за помощь ребята! Я пытался, но он все еще не работает :( Мне нужно обновить страницу вручную, чтобы показать данные