使用JQuery Mobile添加項目到列表

Question

我是新來的使用JavaScript/JQuery所以apolygies，如果有其他q & a解決我的問題。簡而言之，我嘗試創建一個移動應用程序，它從Parse中提取一些數據，並在加載此頁面時使用它在html頁面上填充列表。

到目前爲止，我有以下的JavaScript文件（ 'DataController類'）：

if(!window.dataCon){ 
DataCon = {}; 
} 

$(document).ready(function(){ 
DataCon.getApps = function(){ 

    renderApps= function(data){ 
       for(var i = 0;i<data.results.length;i++) 
       {    

        var rec = data.results[i]; 

        var appTitle; 

        if(rec.title) appTitle = rec.title; 
        else appTitle = "Title Unknown"; 

        var appCategory; 

        if(rec.category) appCategory = rec.category; 
        else appCategory = "Category Unknown"; 

        var appLastBuilt; 

        if(rec.lastBuilt) appLastBuilt = rec.lastBuilt; 
        else appLastBuilt = "unknown"; 

        $("#myList").append('<li><a href=""><h3>'+ appTitle +'</h3><p>'+ appCategory +'</p><p>'+ appLastBuilt +'</p></a></li>'); 

        $("#myList").listview('refresh'); // This line now updates the listview 
       } 
} 

     $.ajax({ 
     url:  App.Config.endpoint+"/1/classes/Applications", 
     contentType: "application/json", 
     type:  "GET", 
     headers:{ 
     'X-Parse-Application-Id': App.Config.applicationId , 
     'X-Parse-REST-API-Key': App.Config.masterKey 
     }, 
     dataType: "json", 
     success: function(data) { 

     renderApps(data); 
     }, 
     error:function (xhr, ajaxOptions, thrownError){ 
        alert('error Status:'+xhr.status); 
       } 
    }); 
}// JavaScript Document 
}); 

這是從我的.html文件的摘錄

<ul id="myList" data-role="listview" data-theme="g" inset="true"">  
</ul> 

我也有配置一個js文件解析信息，例如applicationId，masterKey和endpoint。我的問題是，當我加載使用'dataController'js文件的html文件時，列表中沒有任何內容顯示！我不確定我做錯了什麼。任何援助或指針將不勝感激。由於

Answer 1

你的函數定義需要一點重構，試試這個：

function renderApps(data){ 
       for(var i = 0;i<data.results.length;i++) 
       {    

        var rec = data.results[i]; 

        var appTitle; 

        if(rec.title) appTitle = rec.title; 
        else appTitle = "Title Unknown"; 

        var appCategory; 

        if(rec.category) appCategory = rec.category; 
        else appCategory = "Category Unknown"; 

        var appLastBuilt; 

        if(rec.lastBuilt) appLastBuilt = rec.lastBuilt; 
        else appLastBuilt = "unknown"; 

        $("#myList").append('<li><a href=""><h3>'+ appTitle +'</h3><p>'+ appCategory +'</p><p>'+ appLastBuilt +'</p></a></li>'); 

        $("#myList").listview('refresh'); // This line now updates the listview 
       } 
} 

$(document).ready(function(){ 
     $.ajax({ 
     url:  App.Config.endpoint+"/1/classes/Applications", 
     contentType: "application/json", 
     type:  "GET", 
     headers:{ 
     'X-Parse-Application-Id': App.Config.applicationId , 
     'X-Parse-REST-API-Key': App.Config.masterKey 
     }, 
     dataType: "json", 
     success: function(data) { 
       renderApps(data); 
     }, 
     error:function (xhr, ajaxOptions, thrownError){ 
        alert('error Status:'+xhr.status); 
       } 
    }); 
}); 

希望這有助於