Sunday, 18 August 2013

jquery mobile listview doesn't update correctly-- interaction issue

jquery mobile listview doesn't update correctly-- interaction issue

I'm trying to develop a web app using jquery mobile and I have found a
weird problem.
In the code I use the function getJson to extract informations from a php
converted file and store it (not all the informations extracted) into a
multidimensional array:
var PL=[];
tempJsonindex=0;
tempPlaylistIndex=0;
loaderPlayslistName=1;
var containerList=' ';
$.getJSON("tracce.php", function(json) {
$.each(json.playlists,function(i,playlist){
$(" #playlistL").append($('<li/>', {
class: 'playlistQueue',
'data-icon':'headphones',
val: i
}).append($('<a/>', {
'data-transition': 'slide',
'text': playlist.playlistName
})));
PL[i]=[];
$.each(playlist.tracks,function(j,track){
PL[i].push({"name":track.name,"artist":track.artist,"file":track.file,"cover":track.cover,"stars":track.stars,"mood":track.mood});
});
});
});
In the "playlistL" listview there are entries that indicates playlists;
the idea is to add the selectioned playlist's tracksinto a jquery mobile's
listview (queueL) positioned in another page. This is the snippet of the
code: when i click on a particular button (addToQueueB), the js take the
array associated to the selectioned playlist and populates the queue with
the element inside it in a listview's tagged form, i.e:
$
("#addToQueueB").click(function(){
var temp=PL[selectedPL];
$(" #queueL").trigger("create")
for(var i=0;i<temp.length;i++){
$(" #queueL").append($('<li/>', {
class: 'songInQueue ui-state-disabled',
val: indexQueue,
"data-icon":"stop",
id: "e"+indexQueue,
}).append($('<a/>', {
'data-transition': 'slide',
'text': temp[i].name+ "-"+temp[i].artist
}).append($('<img/>',{
'src':temp[i].cover
})).append($('<h2/>',{
'text':temp[i].name
})).append($('<p/>'),{
'text':temp[i].artist
})));
indexQueue++;
}
});
The problem is when I go to the queueL's page, the listview is populated
correctly but I'cant interact with it's elements! Moreover, if I add
another group of tracks clicking to another playlist, the new elements are
not displayed correctly in the listview. I tried to insert everywhere
trigger("create") and/or .listview("refresh"), but often it comes an error
o the console, that is (for refresh) :
Uncaught Error: cannot call methods on listview prior to initialization;
attempted to call method 'refresh'
What can I do? Thanks you.

No comments:

Post a Comment