This document provides an overview of ASP.NET AJAX and different approaches to building web applications with it, including server-side ASP.NET, server-side ASP.NET AJAX using UpdatePanels, and client-side ASP.NET AJAX. It discusses features of client-side ASP.NET AJAX like declarative controls, command bubbling, live bindings, and using templates with JSON. It also covers additional ASP.NET AJAX 4.0 features and using data sources like ADO.NET Data Services. The document encourages embracing client-side development for better performance and user experience.
9. Different Types of Web Applications
ASP.NET Server-Side
Pages are rendered on the server and updated
through postbacks
ASP.NET Server-Side AJAX (AJAH)
Pages are rendered on the server and updated
through AJAX requests for HTML
ASP.NET Client-Side AJAX
Pages are rendered on the client and updated
through Ajax requests for JSON
11. Why AJAX Applications Are Good
Less roundtrips
Less bandwidth
Less work on the web server
More responsive
12. Why AJAX Applications are Good
Two developers: an ASP.NET and JavaScript
developer. Ask each developer when a button
click event happens…
13. Overview: 3 Ways to Build an Application
1. Server-Side ASP.NET
2. Server-Side ASP.NET AJAX
3. Client-Side ASP.NET AJAX
14. Overview: Features of Client-Side ASP.NET
AJAX
1. Declarative Client-Side Controls
2. Command Bubbling
3. Live Bindings
4. Saving and Updating Data
5. Using Templates with JSONP
17. Server-Side ASP.NET
Benefits
Safe: No Browser Compatibility Issues
Powerful: Use any programming language
Drawbacks
Responsiveness: User must wait for a postback
Performance: All page content must be rendered
for each interaction
20. Server-Side ASP.NET AJAX
Benefits
Safe: No Browser Compatibility Issues
Powerful: Use any programming language
Compatible: Retrofit existing ASP.NET applications
Drawbacks
Responsiveness: User must wait for a postback (no
simultaneous Ajax)
Performance: (most) page content must be rendered for
each interaction
21. Client-Side ASP.NET AJAX Controls
• Code
renders
• Work
• Controls
sneaky
postback
Web Server Web Browser
23. Client-Side ASP.NET AJAX Controls
Perfection Reached!
Benefits
Responsive: Events happen when they
happen
Performance: Only necessary content is
passed between client and server
Clean separation of content and
behavior
24. Data Sources
ASP.NET AJAX is compatible with anything
that exposes JSON:
ASMX Web Services
WCF Web Services
HTTP Handlers
JavaScript arrays
ASP.NET MVC JSonResult
ADO.NET Data Services
REST Services
.NET RIA Services
29. Technology Independent
Client-Side ASP.NET AJAX…
Works with any modern browser including
IE, Firefox, Chrome, Safari, and Opera.
Works with any back-end technology that exposes
JSON (not dependent on ASP.NET)
Works with HTML pages, no need for ASP.NET.
31. Additional ASP.NET AJAX 4.0 Features
Declarative Client-Side Controls
Command Bubbling
Live Bindings
Saving and Updating Data
32. Declarative Controls
XML Namespaces
xmlns:sys=“javascript:Sys”
xmlns:dataview=“javascript:Sys.UI.DataView”
sys:activate
Activates declarative controls
sys:attach
Attaches a control to a DOM element
34. Command Bubbling
sys:command
A command name such as select, edit, and so on
sys:commandargument
A command argument such as 78
Sys:commandtarget
A control or name of a control that is the target of the
command.
onCommand
DataView event handler that you can use to handle a
custom command
37. Live Bindings
{{ Title }}
Used to execute JavaScript in the context of the
current data item
{binding Title }
WPF style binding syntax
Supports live binding
38. Live Bindings
One-way, One-time - The data value is updated only the first time that
data binding is invoked.
{{ CompanyName }}
One-way, Live - If the underlying data item is modified, the rendered
data value is updated automatically.
<span>{binding CompanyName}</span>
Two-way, Live - If the user changes the data value, the value of the
underlying data item is updated. In addition, if the data item is modified
from another source, the rendered data value is updated.
<input type=“text” value=“{binding CompanyName}” />
40. Data Sources
ASP.NET AJAX is compatible with anything
that exposes JSON:
ASMX Web Services
WCF Web Services
HTTP Handlers
JavaScript arrays
ASP.NET MVC JSonResult
ADO.NET Data Services
REST Services
.NET RIA Services
41. DataContext Class
Provides read/write access to data
Supports change tracking in the browser
Send multiple changes in a single batch to the
server
Use AdoNetDataContext class with ADO.NET Data
Services