Ho un progetto jQuery Mobile che è distribuito in diversi file, ad es.
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" charset="utf-8" src="cordova-2.3.0.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
<link rel="stylesheet" href="css/custom.css" />
<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
<script src="js/methods.js"></script>
</head>
<body>
<!-- Termine Page -->
<div data-role="page" id="firstPage">
<div data-role="header" data-position="fixed">
<h1>Header 1</h1>
...
</div><!-- /navbar -->
<div data-role="content">
...
</div>
</div>
</body>
</html>
secondPage.html
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" charset="utf-8" src="cordova-2.3.0.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
<link rel="stylesheet" href="css/custom.css" />
<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
<script src="js/methods.js"></script>
</head>
<body>
<div data-role="page" id="pageTwo" class="ui-page">
<div data-role="header" data-position="fixed" id="terminDetailSeiteHeader">
<h1>Header 2</h1>
</div>
<div data-role="content">
<div id="contentToFillWithDynamicListView"></div>
</div>
</div>
</body>
</html>
Quindi, ho uno script che dovrebbe effettuare una chiamata a uno script php e generare un listview:
function listViewCreation() {
var url = "http://www.myServer.com/myPhp.php?someParameters=1&callback=?";
$.getJSON(url, function(data) {
$("#contentToFillWithDynamicListView").empty();
var collapsibleList = "<ul data-role="listview">";
var myselfIsIncluded = 0;
$.each(data, function(key, value) {
collapsibleList += "<li>" + value["displayName"] + "</li>";
});
collapsibleList += "</ul>";
$("#contentToFillWithDynamicListView").html(collapsibleList).trigger("create");
});
}
Il .trigger ("create") porta all'errore ... cosa mi manca?
MODIFICA 1
listViewCreation è chiamato nel modo seguente:
$("#pageTwo").live("pageshow", function(e, data){
listViewCreation();
});
MODIFICA 2 Sto recuperando dati remoti da un server diverso,questo sembra essere il motivo dell'errore; ma non so come risolverlo ... sto recuperando i dati su entrambe le pagine (1 e 2); per la prima pagina funziona, per la seconda non "t ...
$.getJSON(url, function(data) {
...
}
risposte:
9 per risposta № 1Vedo che stai utilizzando l'ultima versione stabile di jQuery mobile.
Il tuo problema è
trigger("create");
non viene utilizzato per il restyling di jQuery mobile listview. Dovresti usare :
.listview("refresh");
anziché. Non fidarti della documentazione ufficiale di jQM, innescare ( "creare") dovrebbe essere deprecato. Ogni widget jQM ha una funzione pensata per aggiornarlo, ad esempio pulsante ("aggiorna").
Inoltre non usare innescare ( "creare") quando si cambia intestazione, piè di pagina o contenuto, non funzionerà, è possibile attivare la creazione di pagine sulla pagina:
trigger("pagecreate");
MODIFICARE :
In caso di:
Errore non rilevato: impossibile chiamare metodi su listview precedenti a inizializzazione; ha tentato di chiamare il metodo "refresh"
Chiamata:
$("#listviewid").listview().listview("refresh");
La prima chiamata lo inizializzerà e la seconda lo modellerà.
Scopri di più su questo argomento in questo ARTICOLO.