AJAX = Asynchronous JavaScript and XML. AJAX is not a new programming language, but a new way to use existing standards. AJAX is the art of exchanging data with a server, and updating parts of a web page - without reloading the whole page.

1. By SAFAL AGRAWAL

2. Why AJAX ?
 What is AJAX ?
Technologies Used In AJAX
Classic vs. AJAX
What is ASP.NET AJAX?
3-Tier Client/Server applications using AJAX.
ASP. Net AJAX Framework
Characteristics of Conventional Web Applications
Macromedia Flash
Real-Life Examples of AJAX AppsBy SAFAL AGRAWAL

3.  Intuitive and natural user interaction
No clicking required
Mouse movement is a sufficient event trigger
 "Partial screen update" replaces the
"click, wait, & refresh" user interaction model
 Only user interface elements that contain new
information are updated asynchronously
 The rest of the user interface remains
displayed without interruption
By SAFAL AGRAWAL

4. Standards-based presentation using
XHTML and CSS
Dynamic display and interaction
Using the Document Object Model
Data Interchange and Manipulation using XML
and XSLT
Asynchronous data retrieval using
XMLHttpRequest
JavaScript binding everything together
By SAFAL AGRAWAL

5. AJAX Uses HTTP Requests
With AJAX, your JavaScript communicates
directly with the server, through the JavaScript
XMLHttpRequest object
With an HTTP request, a web page can make a
request to, and get a response from a web server -
without reloading the page. The user will stay on
the same page, and he or she will not notice that
scripts request pages, or send data to a server in
the background.
By SAFAL AGRAWAL

6. JavaScript
Loosely typed scripting language
 JavaScript function is called when an event in a page occurs
 Glue for the whole AJAX operation
DOM
Represents the structure of XML and HTML documents
API for accessing and manipulating structured documents
CSS
Allows for a clear separation of the presentation style from the
content and may be changed programmatically by JavaScript
XMLHttpRequest
JavaScript object that performs asynchronous interaction with
the server By SAFAL AGRAWAL

7. Scripting language
Dynamic and weakly typed
Prototype-based with first-class functions
Semantics similar to functional languages
Standardized as ECMAScript
Supported by most modern browsers
But sometimes disabled for security reasons
Although standardized, browser-specific issues
exist
By SAFAL AGRAWAL

8. Object Oriented Representation for XML and
HTML documents
Based on Hierarchical (Tree) Structure
Allows programs and scripts to build
documents, navigate their structure, add,
modify or delete elements and contents
Provides a foundation for developing querying,
filtering, transformation, rendering etc.
applications on top of DOM implementations
By SAFAL AGRAWAL

9. Set of Formatting rules that tell the browser how
to present the document
Helps to separate the content from the
presentation
Reduce the download time by removing the
formatting information from the document
More control over formatting than HTML
By SAFAL AGRAWAL

10. A JavaScript Class that lets you make
asynchronous HTTP requests from JavaScript
Make an HTTP request from a JavaScript event
A call back JavaScript function is invoked at each
state of the HTTP request & response
First introduced by MS as an ActiveX object
Some XMLHttpRequest Methods
Open:
Specify the HTTP method, URL and async/sync
Send:
Initiates the request. Can also specify POST data
By SAFAL AGRAWAL

11. OnReadyStateChange - call back function for
state changes
ReadyState - the current state of the HTTP call
ResponseText - the text result of the request
ResponseXML - DOM xml object from the
request
Status - HTTP status code of the response
StatusText - HTTP status text
By SAFAL AGRAWAL

12. By SAFAL AGRAWAL

13. High Productivity AJAX Development Framework
Fewer concepts, fewer lines of code
Application and UI building blocks for common
scenarios
Works/builds on Top of ASP.NET.
Easy to Author, Debug, and Maintain
Clean separation of content, style, behavior, & code
Well integrated with design and development tools
Seamlessly integrated application model
Works with ASP.NET pages and server controls
Allows access to ASP.NET web services &
components
Standards-Based: Works Cross-Browser!
A Framework for building Richer, more
Interactive, Standards-based Web Experiences
By SAFAL AGRAWAL

14. By SAFAL AGRAWAL

15. Desktop application “Look and Feel”
Richer user interactions
Improved scalability
Increased responsiveness
Richer application functionality
Better end-user experiences
Decreased bandwidth utilization
More rapid user feedback
By SAFAL AGRAWAL

16. Scenarios
Mash-up and composite applications and sites
Components and Gadgets (Live.com, Windows Sidebar)
Powerful script framework
Rich type system and class library for JavaScript
Component model and UI framework
Rich client-side data access and data binding
Easily integrated with server application model
Easily consume web services from browser
Script access to ASP.NET application services
Server-side bridge to reuse 3rd party services
By SAFAL AGRAWAL

17. Server-centric web sites and apps
 Work with existing server application model
Keep core UI/application logic on server
 Improve latency, interactivity, personalization
Client-centric browser applications
 Fully exploit DHTML in presentation tier
 The DOM is back … never went away ;-)
 Use AJAX for data, services, composition
 Enable new immersive experiences
ASP.net AJAX provides a great framework for
both
By SAFAL AGRAWAL

18. By SAFAL AGRAWAL

19. The client architecture includes libraries for
component support, Browser compatibility,
Networking, and Core services.
Client components enable rich behaviors in the
browser without PostBacks
Components, which are non-visual objects that
encapsulate code.
Behaviors, which extend the behavior of existing
DOM elements.
Controls, which represent a new DOM element
that has custom behavior.By SAFAL AGRAWAL

20. By SAFAL AGRAWAL

21. The server pieces that support Ajax development
consist of ASP.NET Web server controls and
components that manage the UI and flow of an
application.
The server pieces also manage serialization,
validation, and control extensibility.
 There are also ASP.NET Web services that enable
you to access ASP.NET application services for
forms authentication, roles, and user profiles.
Partial-page rendering, which updates regions of the
page by using an asynchronous PostBack.
By SAFAL AGRAWAL

22. “Click, wait, and refresh” user interaction
Any communication with the server forces a page
refresh
Synchronous “request/response” communication
model
The user has to wait for the response
Page-driven: Workflow is based on pages
Page-navigation logic is determined by the server
By SAFAL AGRAWAL

23. Navigation & control
Easier movement within or between Websites
Searching
Improved search engine capabilities
Communication
Aids for human-to-human and human-to-computer
interaction
Web services
Ajax is useful for supporting Service-Oriented
Architectures (SOA)
System tasks
Background tasks not directly apparent to the user
By SAFAL AGRAWAL

24. Designed for playing interactive movies
 Programmed with ActionScript
 Implementation examples
Macromedia Flex
Laszlo suite (open source)
Pros:
Good for vector graphics
Cons:
Browser needs a Flash plug-in
ActionScript is proprietary and hard to debug
By SAFAL AGRAWAL

25. No plug-ins for AJAX
Flash development tools cost money
Flash typically has slower page load time
Flash can work on older browsers
ActionScript doesn't have a cross
Browser Issues
Flash can access other domains if
There is a crossdomain.xml file
By SAFAL AGRAWAL

26. By SAFAL AGRAWAL

27. By SAFAL AGRAWAL

28. A user can drag the entire map by using the
mouse
Instead of clicking on a button or something
The action that triggers the download of new
map data is not a specific click on a link but a
moving the map around with a mouse
Behind the scene - AJAX is used
The map data is requested and downloaded
asynchronously in the background
Other parts of the page remains the same
No loss of operational context
By SAFAL AGRAWAL

29. Simple navigation & control
Simple search tasks
Non-Synchronizable system tasks
By SAFAL AGRAWAL

30. AJAX represents a generic application model
that would enable more interactive, more
responsive, and smarter Web applications.
AJAX is not tied to a particular programming
language, data format, or network object and
is defined by two core attributes: partial
screen update and asynchronous
communication.
By SAFAL AGRAWAL

31. http://www.Google.com
http://msdn.microsoft.com/en-us/library
/ee341002.aspx
http://jquery.com
http://www.Bing.com
http://www.asp.net
http://www.a jax.org
http://en.wikip edia.org/wiki/AJAX
By SAFAL AGRAWAL

32. By SAFAL AGRAWAL