1. MIS 324 -- Professor Sandvig MIS 324 Professor Sandvig
5/29/2018
AJAX
MIS 324
Professor Sandvig

2. MIS 324 -- Professor Sandvig
5/29/2018
Today
What is AJAX
Benefits & Uses
Implementation
Do-it-yourself
Download API
ASP.NET Ajax
Summary

3. MIS 324 -- Professor Sandvig
5/29/2018
What is AJAX
Acronym
Asynchronous JavaScript And XML
What it is
JavaScript in web page retrieves data from server
Allows partial page refresh
Reduces need to refresh entire page

4. MIS 324 -- Professor Sandvig
5/29/2018
What is AJAX

5. MIS 324 -- Professor Sandvig
5/29/2018
What is AJAX
Data format does not need to be XML
Depends upon use
Popular formats:
JSON
Text
XML
CSV
Custom

6. MIS 324 -- Professor Sandvig
5/29/2018
Benefits & Uses
Benefits:
Richer experience for user
More like using desktop application
Uses
Google Suggest (JSON)
Kelly Blue Book (Cascading Menus) (JSON)
REI product image (menu) (JSON)
Google Maps (blob)
Amazon (wishlist) (JSON)
etc. etc.

7. MIS 324 -- Professor Sandvig
5/29/2018
Implementation
Options:
Do-it-yourself
Lightweight, flexible
write or modify JavaScript or jQuery
Use API
Google, Bootstrap, Highslide, …

8. MIS 324 -- Professor Sandvig
5/29/2018
Do it yourself
Client
Include JavaScript or jQuery in web page
Requests data from server
Server
Web service provides data
Format: XML, JSON, HTML, …

9. MIS 324 -- Professor Sandvig
5/29/2018
Do it yourself
Benefits
Flexible
Lightweight
Drawbacks
Time consuming
Some knowledge of JavaScript/jQuery

10. Do it Yourself Examples
MIS Professor Sandvig
5/29/2018
Do it Yourself Examples
Client Language
Data
Example
JavaScript
XML
ZipCodesForCity.asmx AjaxZipCode.aspx
jQuery
(same .asmx)
AJAXZipCode.aspx
JSON
AjaxZipCode
HTML
Bookstore
AngularJS
default.aspx
Home rolled
CarParts.com

11. MIS 324 -- Professor Sandvig
5/29/2018
Use AJAX API
Ajax applications written by others
Google AJAX APIs
Search
Maps
Tree Tour
Facebook APIs
/bird/ajaxSearch example

12. MIS 324 -- Professor Sandvig
5/29/2018
Summary
AJAX
Use to improve user experience
Partial page refreshes
Options:
Code you own
Use APIs
ASP.NET AJAX