嗨,我是编程新手。我想使用jQuery在HTML表格中显示Json数据。以html表格格式显示json数据
输出来自服务器:
{"status":1,"insert":1,"data":[{"id":"1","name":"Jatin","email":"[email protected]","status":"1"},{"id":"2","name":"Shubham","email":"[email protected]","status":"1"},{"id":"3","name":"Aneh","email":"[email protected]","status":"1"},{"id":"52","name":"php","email":"[email protected]","status":"test"},{"id":"53","name":"faf","email":"as","status":"d"},{"id":"54","name":"taus","email":"alksd","status":"fdasd"},{"id":"55","name":"nake","email":"nakk","status":"naii"},{"id":"56","name":"test1","email":"tausf","status":"dfasd"},{"id":"57","name":"","email":"","status":""},{"id":"58","name":"shubu","email":"[email protected]","status":"12"},{"id":"59","name":"panku","email":"[email protected]","status":"3"},{"id":"60","name":"Jatin","email":"[email protected]","status":"123d"}]}
HTML代码:
<table border="1" align="center">
<tr>
<td> <input type="button" id="display" value="Display All Data" /> </td>
</tr>
</table>
<div id="responsecontainer" align="center">
</div>
的jQuery:
<script>
$(document).ready(function() {
$("#display").click(function() {
$.ajax({ //create an ajax request to load_page.php
url:'http://localhost/webservice/php_webservices/WebServices.php?method=select',
type: "POST",
dataType: "html", //expect html to be returned
success: function(response){
$("#responsecontainer").html(response);
//alert(response);
}
});
});
});
</script>
尝试一些处理响应,转换为javascript对象,执行数组中每个项目的循环,通过字符串操作创建所需的html tr-td,并且您很好。 – Dharmang
或结帐AngularJS(表格示例http://www.w3schools.com/angular/angular_tables.asp)。它可以让你使用几行代码。 – Fredster