Download Introduction to ASP.NET - Western Washington University

AJAX
MIS 424
Professor Sandvig
Today
1. What is AJAX
2. Benefits & Uses
3. Implementation
1.
2.
3.
Do-it-yourself
Download API
ASP.NET Ajax
4. Summary
What is AJAX
Acronym

Asynchronous JavaScript And XML
What it is



JavaScript in web page retrieves data from
server
Data format is XML
Allows partial page refresh
Reduces need to refresh entire page
What is AJAX
Data format does not need to be XML
Depends upon audience
Popular formats:





JSON
Text
XML
CSV
Custom
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)
MIS 314 bookstore (HTML)
etc. etc.
Implementation
Options:
1. Do-it-yourself


2.
Lightweight, flexible
write or modify JavaScript or jQuery
Use API
1.
3.
Google, Yahoo, Highslide, …
ASP.NET AJAX



drag & drop in VS
convenient
adds a lot of code to application
Do it yourself

Client
Include JavaScript or jQuery in web page
Requests data from server

Server
Web service provides data
Format: XML, JSON, HTML, …
Do it yourself
Benefits


Flexible
Lightweight
Drawbacks


Time consuming
Some knowledge of JavaScript/jQuery
Do it Yourself Examples
XML
JavaScript
Jquery
ZipCodesForCity.asmx
(same .asmx)
AjaxZipCode.aspx
AJAXZipCode.aspx
HTML
Bookstore
JSON
AjaxZipCode
Home grown
CarParts.com
Use AJAX API
Ajax applications written by others

Google AJAX APIs
Search
Maps
Calendar

Facebook APIs
ASP.NET AJAX
ASP.NET provides built-in AJAX
functionality
Two flavors:

Built into some Data Controls
Limitations

ScriptManager & Update Panel
Very flexible
Server Controls
Built in AJAX functionality

GridView, DetailsView, FormView
Property: AllowSortingAndPagingCallbacks
Benefits

Easy to implement
Limitations:


Controls cannot use templates
Inefficient: retrieves all data and discards extra
UpdatePanel
UpdatePanel


Wrap any server controls
Become AJAX enabled
Benefits


Easy to implement
Flexibility
Mix & match controls
Specify triggers
Update Panel
Disadvantage

JavaScript cannot be tweaked
Fine if it meets your needs

Heavy
All controls are repopulated
Viewstate also sent/received
Example:

Cascading Dropdown:
AjaxAspNet.aspx
Summary
AJAX
Use to improve user experience

Partial page refreshes
Options:
1.
2.
3.
Code you own
Use APIs
ASP.NET AJAX