Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Lecture Outline JSON AJAX
JSON http://www.json.org/ A lightweight data-interchange format. Humans readable. Easy for machines to parse and gener...
JSON (Cont’d) Built on two structures:    A collection of name/value pairs (object)        An object begins with { and ...
JSON (Cont’d) There are libraries in nearly all languages to parse  JSON files. In JavaScript, these libraries contain f...
Try JSON Library
AJAX Allows client-side JavaScript to request and receive  data from a server without refreshing the web page. Only part...
Steps to send a simple ajax           request1. Create XMLHttpRequest Object2. Open the request, set the HTTP method and U...
Sending Request var xhr = new XMLHttpRequest(); xhr.onreadystatechange = myCallback; xhr.open(GET, somefile.txt, true);...
For Cross-browser  compatibility
readyState valuesValue       Description0           Uninitialized1           Loading2           Loaded3           Interact...
Some status valuesValue        Description200          Ok204          No content401          UnAuthorized404          Not ...
Processing Requestfunction myCallback() {   if (xhr.readyState < 4) {        return;   }   if (xhr.status !== 200) {      ...
Try AjaxUse Developer tools
References Object-Oriented JavaScript Create Scalable, reusable, high  quality JavaScript applications and libraries, Sto...
AJAX and JSON
AJAX and JSON
AJAX and JSON
AJAX and JSON
AJAX and JSON
Upcoming SlideShare
Loading in …5
×

AJAX and JSON

Asynchronous JavaScript And XML is described relative to javascript, and a brief on JSON

  • Be the first to comment

AJAX and JSON

  1. 1. Lecture Outline JSON AJAX
  2. 2. JSON http://www.json.org/ A lightweight data-interchange format. Humans readable. Easy for machines to parse and generate. A text format that is completely language independent. An ideal data-interchange language.
  3. 3. JSON (Cont’d) Built on two structures:  A collection of name/value pairs (object)  An object begins with { and ends with }. Each name is followed by : and the name/value pairs are separated by ‘,’ .  An ordered list of values (array)  An array begins with [ and ends with ]. Values are separated by ‘,’ . A value can be a string in double quotes, or a number, or true or false or null, or an object or an array.
  4. 4. JSON (Cont’d) There are libraries in nearly all languages to parse JSON files. In JavaScript, these libraries contain function to convert from objects to json text and vice versa.
  5. 5. Try JSON Library
  6. 6. AJAX Allows client-side JavaScript to request and receive data from a server without refreshing the web page. Only partial reload occurs Jesse James Garrett originally coined the term Ajax in 2005. (www.adaptivepath.com/publications/essays/archives /000385.php ). Let web applications look and behave more like desktop applications than web sites,
  7. 7. Steps to send a simple ajax request1. Create XMLHttpRequest Object2. Open the request, set the HTTP method and URL3. Set callback for onreadychange4. Send asynchronous request5. Create an event to call the previous steps
  8. 8. Sending Request var xhr = new XMLHttpRequest(); xhr.onreadystatechange = myCallback; xhr.open(GET, somefile.txt, true); xhr.send();
  9. 9. For Cross-browser compatibility
  10. 10. readyState valuesValue Description0 Uninitialized1 Loading2 Loaded3 Interactive4 Complete
  11. 11. Some status valuesValue Description200 Ok204 No content401 UnAuthorized404 Not Found411 Request Timeout
  12. 12. Processing Requestfunction myCallback() { if (xhr.readyState < 4) { return; } if (xhr.status !== 200) { alert(Error!); // the HTTP status code is not OK return; } alert(xhr.responseText); }
  13. 13. Try AjaxUse Developer tools
  14. 14. References Object-Oriented JavaScript Create Scalable, reusable, high quality JavaScript applications and libraries, Stoyan Stefanov, 2008. ECMAScript Language Specification, 5.1 edition, July 2011, http://www.ecma-international.org/ Beginning JavaScript, 4th Edition, Paul Wilton, Jeremy McPeak, 2010

×