[英]Display JSON object's contents returned from an URL on an html page
I have JSON object returned from an URL in the format 我有一个URL格式返回的JSON对象
<pre>
[{"merchant":"eletspay","accountName":"hello","accountType":"Savings","ifscCode":"5545","email":"mypal.1989@gmail.com","phoneNum":"98654567876","isDefaultAccount":false},{"merchant":"eletspay","accountName":"helloi32irn","accountType":"Savings","ifscCode":"5545","email":"mypal.appa99721989@gmail.com","phoneNum":"98654567876","isDefaultAccount":false}]
</pre>
And I want to loop through the JSON object for each index to display all of the contents in an html table where the table is 我想遍历每个索引的JSON对象以显示html表中的所有内容,其中该表是
<pre>
<table class= "dataTable">
<tr>
<td><input type="radio" name="activate"></td>
<td>jsonObject[1.value]</td>
<td>jsonObject[1.value]</td>
<td>jsonObject[1.value]</td>
<td>jsonObject[1.value]</td>
<td>jsonObject[1.value]</td>
<td>jsonObject[1.value]</td>
</tr>
<tr>
<td><input type="radio" name="activate"</td>
<td>jsonObject[2.value]</td>
<td>jsonObject[2.value]</td>
<td>jsonObject[2.value]</td>
<td>jsonObject[2.value]</td>
<td>jsonObject[2.value]</td>
<td>jsonObject[2.value]</td>
</tr>
</table>
</pre>
Where jsonObject[1.value]
will be the data at index 1 and jsonObject[2.value]
will be the data at index 2 and so on. 其中jsonObject[1.value]
将是索引1的数据,而jsonObject[2.value]
将是索引2的数据,依此类推。
PS: I'm new to Javascript and hence Jquery, so please ingore/rectify any stupid errors in the html part. PS:我是Java和Jquery的新手,所以请请ingore /纠正html部分中的任何愚蠢错误。
Try this http://jsfiddle.net/aBZDg/13/ : 试试这个http://jsfiddle.net/aBZDg/13/ :
var jsonData = [{"merchant":"eletspay","accountName":"hello","accountType":"Savings","ifscCode":"5545","email":"mypal.1989@gmail.com","phoneNum":"98654567876","isDefaultAccount":false},{"merchant":"eletspay","accountName":"helloi32irn","accountType":"Savings","ifscCode":"5545","email":"mypal.appa99721989@gmail.com","phoneNum":"98654567876","isDefaultAccount":false}];
function writeTable() {
var out = '';
for(var row=0; row<jsonData.length; row++) {
out += '<tr>'
+ '<td>' + jsonData[row].merchant + '</td>'
+ '<td>' + jsonData[row].accountName + '</td>'
+ '<td>' + jsonData[row].accountType + '</td>'
+ '<td>' + jsonData[row].ifscCode + '</td>'
+ '<td>' + jsonData[row].email + '</td>'
+ '<td>' + jsonData[row].phoneNum + '</td>'
+ '<td>' + jsonData[row].isDefaultAccount + '</td>'
+ '</tr>';
}
document.write(out);
}
and then call this function where you want to show table. 然后在要显示表格的地方调用此函数。
<table border="1">
<tr>
<th>Merchant</th>
<th>AccountName</th>
<th>AccountType</th>
<th>IfscCode</th>
<th>Email</th>
<th>PhoneNum</th>
<th>IsDefaultAccount</th>
</tr>
<script>writeTable();</script>
</table>
Try using the jquerytemplate 尝试使用jquerytemplate
http://www.diplo.co.uk/blog/2011/3/1/using-jquery-templates-to-bind-to-json-data.aspx http://www.diplo.co.uk/blog/2011/3/1/using-jquery-templates-to-bind-to-json-data.aspx
This will loop the json data returned from your url 这将循环从您的网址返回的json数据
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.