AJAX with JSON - Output formatting

(Page 4 of 4 )

It will be a simple matter to stuff the retrieved values into a suitable HTML element. In the case of XMLDOM with AJAX, the retrieved values were stuffed into <div/> elements. Using the listing shown it is easy to retrieve values into table cells.

Partial listing from AjaxJsonTbl.htm:

var jsonT = eval('('+ xhr.responseText +')');
//document.write("<p>HI</p>");
var str='<table border="1" bgcolor="#C080FF" 

style="font-family:tahoma;font-size:10px;">';
str=str+'<tbody id="webstudnts">'; 
str=str+'<tr style="background-color:#dbb;">';
str=str+'<td>Id</td><td>Name</td><td>Legacy skill</td>';
document.write(str);
for(i=0; i<3; i++){
    document.write("<tr><td>" +jsonT.wclass[i].student.id+ "</td><td>" + 
jsonT.wclass[i].name+ "</td><td> " +
                    jsonT.wclass[i].legacySkill +"</td></tr>");
}
document.write("</tbody></table>"); 

The display of the above page is shown in the next picture.

Summary

The article has clearly compared XML and JSON as applied to the same basic data structure. Which one you choose would depend on the circumstances. Yahoo and Google have used JSON for some of  their eye catching search applications. JSON is somewhat more restricted than XML, which applies to a larger range of applications. However, for retrieving data of the type normally used in simple web applications, JSON appears to be better suited. When this goes online there is a possibility that the code may get corrupted; anticipating this, HTML files will be made available if a request is made to the author.

DISCLAIMER: The content provided in this article is not warranted or guaranteed by Developer Shed, Inc. The content provided is intended for entertainment and/or educational purposes in order to introduce to the reader key ideas, concepts, and/or product reviews. As such it is incumbent upon the reader to employ real-world tactics for security and implementation of best practices. We are not liable for any negative consequences that may result from implementing any information covered in our articles or tutorials. If this is a hardware review, it is not recommended to open and/or modify your hardware.

Comments On: AJAX with JSON

· As noted in the conclusion JSON has certain advantages over XML. It also has...    · You can also try this very simple example of using json...    · as i was going from step to step, clicking my way through this tutorial, I was like,...   >>> Post your comment now!