Je construis une application Web mobile avec JQuery Mobile et j'ai un problème. J'utilise JQuery pour analyser un fichier XML et créer des éléments de liste. Il construit la liste, puis appépend cette liste de Mon problème est que la liste ne se rafraîchit jamais. Cela continue de s'accrocher de manière incorrecte. Est-ce que je fais quelque chose de mal? Mon code est-il correct? FYI, j'ai essayé toutes sortes de variations de code: merci! sur la page. J'ai lu que pour que la liste soit styled correctement, vous devez appeler
.ListView ('Actualiser') Après avoir ajouté les données pour actualiser la liste afin que JQuery Mobile puisse définir le style correct sur Liste. .ListView () , .Listview ('Actualiser') , etc.
5 Réponses :
Votre code a l'air bien envers moi ... ressemble presque exactement à ce que j'ai dans mon application.
Peut-être que le problème réside dans votre HTML? Il devrait ressembler à quelque chose comme:
J'ai couru dans ce problème avec le code ressemblant à la vôtre. Ma solution consistait à placer l'actualisation dans l'option $ .ajax "complète".
complete: function() {
$('#list-id').listview('refresh');
}
Merci, je vais essayer ça!
Ma solution consistait à utiliser aucun paramètre dans la méthode ListView comme dans extrémité .. p> voici ma fonction AJAXGET: P> function ajaxGet(url,target,doOnCallBack){
$.ajax({
url: url,
error:function(x,e){handleAjaxError(x,e);},
beforeSend:function(){$.mobile.showPageLoadingMsg();},
complete:function(){$.mobile.hidePageLoadingMsg();doOnCallBack();},
success:function(data, textStatus, jqXHR){target.html(data);}
});
}
La réponse de Spike a fonctionné pour moi - je visais le parent de l'UL DIV. J'ai également besoin de lier la fonction Ajax à PageCreate - c'est-à-dire:
<div data-role="page" data-theme="b" id="my-page">
<div data-role="header">
<h1>Podcast List</h1>
</div>
<div data-role="content">
<ul id="podcastList" data-role="listview">
</ul>
</div>
</div>
<script>
$('#mypage').bind('pagecreate',function(){
// instead of $(window).load(function(){
$.ajax({
type: "GET",
url: "podcast.xml",
dataType: "xml",
async: false,
success: parseXml
complete: function() {
$('#podcastList').listview('refresh');
}
});
});
</script>
$("#podcastList").trigger("create");