JSON
Help: IE7 won’t load my JSON but IE8 will – Using a JSON Validator
I just ran into this issue, and found surprisingly little documentation. My JSON request wasn’t returning. I was using the jQuery “getJSON” method to send the request out. Nothing was coming back.
Introduction to JSON (JavaScript Object Notation)
JSON, JavaScript Object Notation, is a very useful tool for AJAX developers (and many others I’m sure).
XML is fairly difficult for JavaScript to parse out. It also includes quite a bit of infrastructure overhead in certain applications.
Implementation of JSON can be very easy, it is imported natively in JavaScript through the eval() procedure. It is also supported by many server side languages.
Lets take a basic example of an XML statement and see it’s JSON equivalent:
XML
<book id=”123″><author>Tom Jones</author></book>
JSON
{“book”: {“id”:”123″, “author”:”Tom Jones”}}
It may seem more cryptic, but if you look, that’s just because there are fewer iterations of key words. The compression gets extended when you implement longer arrays of data.
The best part about JSON, in my opinion, is the speed increase you get when using it in javascript. Please implement something in XML and JSON with the same data, you will notice a significant performance increase.
JSON is easy to consume in JavaScript:
objJSON = eval(jsonDataFeed);
You can access data (using our example earlier):
alert(objJSON.book.id);
alert(objJSON.book.author);
Server side implementation can be quite simple as well:
[php]
$dataObject = array();
$dataObject["book"] = array();
$dataObject["book"]["id"] = 123;
$dataObject["book"]["author"] = “Tom Jones”;
echo (json_encode($dataObject));
[/php]
Ask any questions in the comments below.
Here are some articles to continue your exploration of JSON:
Featured Posts
- HTML Fadein Fadeout: Basic Javascript/AJAX Tutorial using jQuery's fadeTo
- Basic AJAX Tutorial: Smooth Scrolling Text Marquee with a jQuery plugin
- Basic AJAX Tutorial: jQuery toggle and slide
- Hosting: How to pick a WordPress Host
- Basic jQuery Tutorial: Modify CSS classes and attributes, Hover and Toggle example
Follow Me
Email Subscription
Recent Posts
Top Commentators
- No commentators.
Archives
Tags
Blogroll
- 456 Berea St
- ActionScript 3 Design Patterns
- adactio – home of Jeremy Keith
- ajaxian
- Boxes and Arrows
- Chris Brogan
- CSS Globe
- InsideRIA
- Jarrod Michael Studios
- Mad Vertices
- NETTUTS
- Portsmouth Community Calendar
- Roomware Blog
- Signal vs. Noise
- Six Revisions
- Snook
- Style Grind
- Tiago’s Weblog
- Viget Extend
- Vitamin
- Whats the latest
- Why Banks Fail
- Woork
- zupko.info
