SynapseIndia asp.net2.0 ajax Development SynapseIndia Drupal development, SynapseIndia Ecommerce development, SynapseIndia Sharepoint development, SynapseIndia PHP development, SynapseIndia Dotnet development

1. SynapseIndia ASP.NET2.0SynapseIndia ASP.NET2.0
AJAXAJAX

2. Table of Contents
• What is AJAX?
• What is ASP.NET2.0 AJAX?
• Why use ASP.NET2.0 AJAX?
• The Client and Server Pieces of ASP.NETAJAX
• Installing ASP.NET AJAX
• AJAX Libraries for ASP.NET
• ScriptManager
• Partial Page Updates
 UpdatePanel Control
 UpdateProgress Control
 Timer Control
Table of Contents

3. Table of Contents
• ASP.NET AJAX Client Library
 AJAX JavaScript Extensions
 AJAX Base Class Library
• ASP.NET AJAX Networking
 XMLHttpRequest Object
 Data Communication
 JSON
• Calling Web Services from Client Script
• Rich AJAX Toolkit Controls & ASP.NET Futures CTP
• Server and Client Reference
Table of Contents

4. What is AJAX?
Ajax (asynchronous JavaScript and XML), or AJAX, is a group of interrelated web development
techniques used for creating interactive web applications or rich Internet applications
Google Suggest provides users with a list
of options based on keyed-in characters
without refreshing the page.
Google Maps covers the entire planet,
though with varying degrees of granularity.
It offers satellite pictures as well as the
usual abstract map representations.
What is AJAX?

5. History of AJAX?
Jesse James Garrett, co-founder and president of Adaptive
Path in 2005, coined the term Ajax and defined the
concepts behind it.
Examples
• Flickr - A Yahoo! Company
 Flickr is a photo storage and display program
that uses AJAX.
• Gmail - Google
 Gmail is an AJAX powered email system.
History of AJAX?

6. AJAX Technology?
It refers specifically to these
technologies:
• XHTML and CSS for
presentation
• The Document Object
Model for dynamic
display and interaction
with data
• XML and XSLT for the
interchange and
manipulation of data,
respectively
• The XMLHttpRequest
object for asynchronous
communication
• JavaScript to bring these
technologies together
AJAX Technology?

7. What is ASP.NET AJAX?
ASP.NET AJAX is the name of Microsoft’s AJAX solution, and it refers to a set of client and
server technologies that focus on improving web development with Visual Studio
What is ASP.NET AJAX?

8. Why use ASP.NET AJAX?
ASP.NET AJAX applications offer:
• Improved efficiency by performing significant parts of a Web page's processing in the
browser.
• Familiar UI elements such as progress indicators, tooltips, and pop-up windows.
• Partial-page updates that refresh only the parts of the Web page that have changed.
• Client integration with ASP.NET application services for forms authentication and user
profiles.
• Integration of data from different sources through calls to Web services.
• A framework that simplifies customization of server controls to include client capabilities.
• Support for the most popular and generally used browsers, which includes Microsoft
Internet Explorer, Mozilla Firefox, and Apple Safari.
Why use ASP.NET AJAX?

9. The Client and Server pieces of ASP.NET AJAX
ASP.NET is built on top of the Microsoft
Internet Information Services (IIS) web
server.
ASP.NET AJAX builds on top of that and the
web services it includes. The Microsoft AJAX
Library runs in the browser to manipulate the
DOM, communicate asynchronously with the
web server, and take advantage of ASP.NET
services.
The Client and Server pieces of ASP.NET AJAX

10. The Client and Server pieces of ASP.NET AJAX
Microsoft AJAX Library
It is a JavaScript library that works on a variety of browsers and serves to simplify JavaScript
development.
It is a type system and set of class libraries that simplify writing JavaScript to enhance the
user experience, manipulate the DOM, and communicate with the web server
ASP.NET 2.0 AJAX Extensions
These extensions build on top of the ASP.NET classes and controls and leverage the Microsoft
AJAX Library sent to the browser.
• They make it easy to quickly take advantage of AJAX technologies by providing a set of
server controls.
• Through a set of standard web services, ASP.NET AJAX is also able to leverage server-
based application services such as authentication and user profile storage
The Client and Server pieces of ASP.NET AJAX

11. Installing ASP.NET AJAX
ASP.NET AJAX includes
• Microsoft ASP.NET 2.0 AJAX Extensions, which is a server framework
• The Microsoft AJAX Library, which consists of client script that runs on the browser.
To install Microsoft ASP.NET AJAX
• Download the ASPAJAXExtSetup.msi installation package from the
ASP.NET AJAX Downloads Web site.
• To add the ASP.NET AJAX Control Toolkit, download and install it from
ASP.NET AJAX Control Toolkit Web site.
If you have Microsoft Visual Studio 2005 installed on your computer, the installation process
installs templates for AJAX-enabled Web site projects.
It also installs an assembly (AJAXExtensionToolbox.dll) that extends the Visual Studio toolbox
Installing ASP.NET AJAX

12. AJAX Libraries for ASP.NET
Ajax.NET Professional: Michael Schwartz developed Ajax.NET Professional as a tool primarily
used to simplify the data transport mechanism that enables a client JavaScript routine to
communicate with a server program.
Anthem.NET: Anthem.NET is a SourceForge project where users are able to download the
sources to the project. It targets ASP.NET 1.1 and ASP.NET 2.0. It has a set of server
controls that use their underlying JavaScript library to communicate with the server
DoJo: It is a client-side library for AJAX development without ties to any server technology.
DoJo has a type system for JavaScript and a function for binding script to events from
JavaScript objects or DHTML elements. One of its strengths is rich support for dynamic
script loading.
AJAX Libraries for ASP.NET

13. AJAX Libraries for ASP.NET
Prototype: It has a type system for scripting in a more object-oriented way. Prototype
provides networking functionality and a method for automatically updating an HTML
element with the results of an HTTP request when given a URL.
Script.aculo.us:Script.aculo.us is built on top of the Prototype library. It includes functionality
for adding drag-and-drop support to an application. It has a lot of effects code for fading,
shrinking, moving, and otherwise animating DOM elements. Script.aculo.us also has a
slider control and a library for manipulating lists of elements.
Rico: The Rico library also builds on top of the Prototype system. It has support for adding
drag-and-drop behavior to browser DOM elements. It also has some controls to bind
JavaScript objects to DOM elements for manipulating data. Rico has constructs for
revealing and hiding portions of a page using an accordion style. It also has animation,
sizing, and fading effects prebuilt for easier use.
AJAX Libraries for ASP.NET

14. ScriptManager
Any AJAX library needs a component or a tool that makes some JavaScript code available on
the client. This script code represents the client infrastructure necessary for the library to
work .
AJAX libraries tend to offer a server-side, often parameterless, component that when dropped
on the page automatically outputs any required scripts. This component is generally known
as the AJAX manager or script manager
In addition to ensuring that the proper script is linked to the page, the script manager typically
• Enables and supports partial page rendering,
• Generates proxy code to call remotely into server-side methods and objects,
• Sets up auxiliary services.
Script Mangager

15. Partial Page Updates-Update Progress Control
Microsoft created the UpdateProgress control to make it easy to provide visual
feedback to the user to indicate that the update is being processed. This is
something like a “busy” hourglass cursor in Windows applications.
using System;
using System.Web.UI;
public partial class UpdateProgress : System.Web.UI.Page
{
protected override void OnLoad(EventArgs e)
{
System.Threading.Thread.Sleep(4000);
base.OnLoad(e);
string theTime = DateTime.Now.ToLongTimeString();
for(int i = 0; i < 3; i++)
{ theTime += "<br />" + theTime; }
time1.Text = theTime;
}
}
Partial Page Updates –Update Progress Control

16. ASP.NET AJAX Client Library-Type System: Class-Inheritance
The constructor must explicitly call initializeBase and pass itself, using the this
keyword, along with an array of the arguments to pass to the constructor of the
base type.
The call to initializeBase takes care of producing the final type with inheritance
semantics in place. The base class constructor is called with the arguments
provided.
The type system of the AJAX Library also provides some reflection functions to
explore the relationship between objects.
if (Wrox.ASPAJAX.Samples.TributeAlbum.isInstanceOfType(anotherAlbum) == true)
{ alert("anotherAlbum is a TributeAlbum");}
if (Wrox.ASPAJAX.Samples.TributeAlbum.inheritsFrom(Wrox.ASPAJAX.Samples.Album)
==true )
{ alert("TributeAlbum inherits from Album");}
ASP.NET AJAX Client Library – Type System : Class - Inheritance

17. Questions / Feedback
Thank You!Thank You!