如何在我的listview中显示json数据在intel xdk

时间:2015-05-12 11:54:58

标签: json intel-xdk jquery-mobile-listview

我正在使用针对UI的intel xdk和jquerymobile框架开发混合应用程序。我试图从URL获取json数据并将其显示到listview中。我已经从网址获取了json数据,但我不知道如何在listview中显示这些数据

这是我的json数据

{

 "nl_wu":[
           {
              "id":"42",
              "year":"2015",
              "month":"jan",
              "title":"newsletter",
               "file":"http://school.com/sample.pdf"
            },

            {
               "id":"39",
               "year":"2015",
               "month":"jan",
               "title":"imagetest",
               "file":"http://school.com/sampleimage.jpg"
             }

           ]

}

这是json检索功能

 function showsmsmessage(){
            var i;
            var out ="";
             var json;
            var arr ;
             var xhr = new XMLHttpRequest();
             xhr.open("GET", "URL", false);
             xhr.onload = function(){
           if(xhr.status == 200)
            {
                var json_string = xhr.responseText;
                json = eval ("(" + json_string + ")");
                var s = JSON.stringify(json);
                arr = $.parseJSON(s);
                for(i=0;i<arr.nl_wu.length;i++)
                {
                     out = arr.nl_wu[i];
                     alert(out.title);
                }

             }
          else if(xhr.status == 404)
           {
             intel.xdk.notification.alert("Web Service Doesn't Exist", "Error");
           }
         else
          {
           intel.xdk.notification.alert("Unknown error occured while connecting to server", "Error");
          }
     }
       xhr.send(); 
} 

这是我在listview中显示json数据的html代码

 <body>
   <div data-role="listview" id="result">
        <ul data-role="listview" data-autodividers="false">
           <li><a href="#">Adele</a></li>
       </ul>
   </div>
 </body>

我想在listview中显示json的标题(动态)。我从json获得标题,只是在警报消息中显示它,但我需要在我的列表视图中显示。在我的html代码中,我只使用静态项创建一个列表视图。

我的问题: -

1)如何在listview中显示json数据(标题)

2)如果我点击数据项,特定的pdf文件或图像文件应该使用json的文件路径下载并在我们的应用程序中显示(我的json中有文件路径)

你能否告诉我如何在我的listview中动态显示json数据(标题)

2 个答案:

答案 0 :(得分:0)

添加此代替SystemParameters.VirtualScreenHeight

alert(out.title);

答案 1 :(得分:0)

它很容易实现。假设list是您从服务器获取的对象。现在我们只需要为每个数组项处理对象。 使用此代码..

    


    var html = '' ;
    $.each(list.nl_wu, function(index, item){
        html = "<li>" ;
        html += "<a href='"+item.file+"'>"+item.title+"</a>" ;
        html += "</li>" ;
    }) ;
    $("#result ul").html(html) ;
    
附: :可能有一些逗号错误或类似的东西,但我希望你有这背后的逻辑。