have been studying parsing JSON from PHP using AJAX to display it in
the client side and jQuery had been a great help to me. Here is a very
simple code in parsing JSON using jQuery that i made.
tablejsondata.php
This file makes the request to a php file and displays the returned data into a table.
<html>
<head>
<title>Parsing JSON from PHP Using jQuery</title>
<script src="http://code.jquery.com/jquery-latest.js" type="text/javascript">
</script>
</head>
<body>
<a href="#" id="loaduserdata">User Data</a>
<table id="userdata" border="1">
<thead>
<th>First Name</th>
<th>Last Name</th>
<th>Email Address</th>
<th>City</th>
</thead>
<tbody></tbody>
</table>
<script>
$(document).ready(function(){
});
$("#loaduserdata").click(function(){
$("#userdata tbody").html("");
$.getJSON(
"jsondata
.php
",
function(data){
$.each(data.userdata, function(i,user){
var tblRow =
"<tr>"
+"<td>"+user.first+"</td>"
+"<td>"+user.last+"</td>"
+"<td>"+user.email+"</td>"
+"<td>"+user.city+"</td>"
+"</tr>"
$(tblRow).appendTo("#userdata tbody");
});
}
);
});
</script>
</body>
</html>
jsondata.php
This is the file that contains the JSON data.
<?php
$json = '{
"userdata": [
{
"first":"Ciaran",
"last":"Huber",
"email":"elementum.purus@utdolordapibus.edu",
"city":"Mayagüez"
},
{
"fi
