JSON(Java Script Object Notation):{mode Now}
Email It!
After last post We will start with example here
UPDATE : visit link password: watblog for working example(you need to edit the page;copy the code and test in your browser as HTML page)
XML format: {replace ‘[' with '<' and ']‘ with ‘>’}
[widget>
[debug>on[/debug]
[window title="Sample Konfabulator Widget"]
[name]main_window[/name]
[width]500[/width]
[height]500[/height]
[/window]
[image xsrc="Images/Sun.png" mce_src="Images/Sun.png" name="sun1"]
[hOffset]250[/hOffset]
[vOffset]250[/vOffset]
[alignment]center[/alignment]
[/image]
[/widget]
JSON format of the above XML:
{"widget": {
"debug": "on",
"window": {
"title": "Sample Konfabulator Widget",
"name": "main_window",
"width": 500,
"height": 500
},
"imageHere": {
"xsrc": "Images/Sun.png",
"name": "sun1",
"hOffset": 250,
"vOffset": 250,
"alignment": "center"
}
}}
Advantages:
1) If you see the difference here;JSON looks more structural,compact and easy to handle(How? later)
2) No of bytes I am saving on the wire is good saving. Check extra tags e.g. ,. Spendthriftness counts everywhere agreed?
3) If I send JSON string in request; i just need to do eval on server(ASP/JSP) and I have object(JSON) to handle. My life becomes simpler there
4) Imagine a scenario in which you get xml response from a server and it contains values for all screen elements. Now you have to find out value for each screen element in response xml and then assign it on the screen. Hell lot of donkey work
Yes xslt bond programmer can write it down in good way.But now look at the thing I can do with JSON below
step1: covert xml to JSON with utility functions available and pass it on to assign2Screen function
step2: iterate over each node in JSON object and find out if that node is available in screen; if Yes assign the value then and there itself;then go to next element and if No go to next element
//step1
var reqXMLData = xml2ObjJSON(globalData);
assign2Screen(reqXMLData);
//step2 call utility function from me
function assign2Screen(data){
for(var something in data){
if( typeof(data[something]) == ‘object’
&& typeof(data[something]) != undefined ) {
//Not a string node…recursive mode
assign2Screen(data[something])
}else{
//something I am looking for ; get it;assign it
document.getElementById(something).value=data[something];
}
}
}
It cant become simpler than this (10 lines assignment code)
I guess its very heavy post for nontechnical guys. But its easy to learn common sense these days.I will discuss AJAX and its preferred scenarios in next post.
Thanks,
Ketan
RSS
Email

(1 votes, average: 4 out of 5)































I really dint get "iterate over each node in JSON object and find out if that node is available in screen; if Yes assign the value then and there itself;then go to next element and if No go to next element".
If element is missing on the screen, then it means that the web page is not in sync with the back end servlet in application level. I might be wrong in ma understanding. Care to explain.
Yes….
In real life scenario ..a response may have elements which are not showed on screen…In the function above
document.getElementById(something).value=data[something]
to be replaced by
if(document.getElementById(something)!=null){
document.getElementById(something).value=data[something];
}
Simply visit this: http://123.writeboard.com/e509df5da531dd6f9
password:watblog
edit the page : copy the code: run in your browser