2013-03-16 2 views
1

J'ai un problème avec l'actualisation d'une vue de liste mobile jquery.Liste de contrôle dynamique avec jquery mobile

Ce code fonctionne très bien:

$(document).bind("pagebeforechange", function(e, data) { 

    // Generating a dynamic list 
     for(var i=0;i<list.length;i++){ 
      var link = '<li><a href="#">'+list[i].name+'</a></li>'; 
      $("#listview").append(link); 
     } 

    // Listview refresh 
    $("#myPage").on('pagebeforeshow', function() { 
     try { 
      $("#listview").listview('refresh'); 
     } catch (e) { 
      $("#listview").listview(); 
     } 
    }); 

    $.mobile.changePage($(#myPage), { 
     transition:"slide", 
     dataUrl:url, 
     allowSamePageTransition:true, 
     reverse:reverse 
    }); 
    e.preventDefault(); 

}); 

Cependant, je dois ajouter dynamiquement une icône à la liste des articles de vue qui sont dans les favoris de l'utilisateur. J'utilise une fonction qui renvoie un tableau par une requête à la base de données locale.

$(document).bind("pagebeforechange", function(e, data) { 

    getFavs(function(favsArray){  

    // Generating dynamic list with image 
     for(var i=0;i<list.length;i++){ 
      favImg = ""; 
      if(favsArray.indexOf(list[i].id) !== -1){ 
       favImg = '<img src="images/star-36-black.png" class="ui-li-icon" />'; 
      }    
      var link = '<li><a href="#">'+favImg+list[i].name+'</a></li>'; 
      $("#listview").append(link); 
     } 

     // Listview refresh 
     $("#myPage").on('pagebeforeshow', function() { 
      try { 
       $("#listview").listview('refresh'); 
      } catch (e) { 
       $("#listview").listview(); 
      } 
     }); 

    }); 

    $.mobile.changePage($(#myPage), { 
     transition:"slide", 
     dataUrl:url, 
     allowSamePageTransition:true, 
     reverse:reverse 
    }); 
    e.preventDefault(); 

}); 

Dans ce second cas, Listview() n'est pas appliquée. Je ne comprends pas pourquoi cette deuxième option est si différente qu'elle casse Listview() ...

+0

Avez-vous essayé 'create'? – Omar

+0

Je viens de découvrir 'create'; Je ne l'ai pas trouvé dans le doc api, mais [ici] (http://forum.jquery.com/topic/page-trigger-create-listview-create-refresh-confusion). En l'utilisant, j'ai juste un support CSS partiel (font-color et font-weight). – Yako

+0

Vous devrez peut-être les créer une seule fois. – Omar

Répondre

0

J'ai trouvé un poste similaire here, bien que la solution diffère. Sur la deuxième option, je dois juste retirer la liaison à pagebeforshow:

// Listview refresh 
     try { 
      $("#listview").listview('refresh'); 
     } catch (e) { 
      $("#listview").listview(); 
     } 

Cependant, je ne comprends pas encore pourquoi la liaison à pagebeforeshow est nécessaire dans la première option, alors qu'il se casse le code dans la deuxième option ...

Questions connexes