如何在intel xdk的listview中显示json数据 [英] how to display json data in my listview in intel xdk
问题描述
这是我的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();
}
这是我的用于在列表视图中显示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>
我想在我的列表视图中动态显示json的标题.我从json获取标题，仅在警报消息中显示它，但我需要在列表视图中显示.在我的html代码中，我只创建了一个带有静态项的listview.
我的问题:-
1)如何在我的列表视图中显示json数据(标题)
2)如果我单击数据项，则应使用json中的文件路径下载特定的pdf文件或图像文件，并将其显示在我们的应用中(我的json中有文件路径)
能否请您告诉我如何在我的列表视图中动态显示json数据(标题)
它非常容易实现.假设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) ;
P.S. :可能有一些逗号错误或类似的错误，但我希望您能理解这背后的逻辑.
i am developing hybrid application by using intel xdk and jquerymobile framework for UI. i am trying to get json data from url and display it into listview. i already got json data from url but i don't know how to display those data in listview
This is my json data
{
"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"
}
]
}
This is json retrieving function
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();
}
this is my html code for displaying json data in listview
<body>
<div data-role="listview" id="result">
<ul data-role="listview" data-autodividers="false">
<li><a href="#">Adele</a></li>
</ul>
</div>
</body>
i want to display title from json in my listview (dynamically). i am getting title from json and just display it in alert message but i need to display in my listview. In my html code i just create one listview with static item.
My Question:-
1) how to display json data(title) in my listview
2) if i click the data item, particular pdf file or image file should download by using file path from json and display it in our app (i have file path in my json)
could you please tell me how to display json data(title) in my listview dynamically
Its very easy to implement. Suppose list is the object which you are getting from the server. Now we just need to process the object for each array item.
use this code..
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) ;
P.S. : There may be some comma mistake or something like that but i hope you got the logic behind this.
这篇关于如何在intel xdk的listview中显示json数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
