Electrosmart.Net

AJAX

In September 2005, Microsoft unveiled a new add-on to ASP.NET [Atlas] aimed at leveraging client-side JavaScript, DHTML, and the XMLHttpRequest object.

This would allow developers to create more interactive AJAX-enabled Web applications.

This framework, referred to as:

Microsoft® AJAX Library, and
ASP.NET 2.0 AJAX Extensions

provides a number of features including:

Client-side data binding
DHTML animations and behaviors
Interception of client POST backs using an UpdatePanel.

How Ajax Is Used

Most AJAX features provide the ability to retrieve data from the server asynchronously in a form that is easy to parse and interact with from client-side JavaScript calls. This allows us to call server-side Web services from client-side JavaScript in an ASP.NET 2.0 AJAX Extensions-enabled page.

Calling Web Services with AJAX

Before we look at how AJAX is used to call a web service, let's just recap on using a web service in the Microsoft .NET Framework.

Creating a proxy using the wsel.exe utility or by using the Add Web Reference feature of Visual Studio®.

Invoking a Web service method through a .NET proxy.

The proxy prepares the XML based on the parameters passed

Translates the XML response it receives into the .NET type specified by the proxy method.

AJAX Extensions

The ASP.NET 2.0 AJAX Extensions replicate the exact same sequence of seamless proxy generation for Web services for client-side JavaScript that will run in the browser, i.e.

Create an .asmx file hosted on your server
Make calls to methods on that service through a client-side JavaScript class

In addition to the standard .asmx Web service attributes, this service attaches ScriptService attribute, making it available to JavaScript clients as well.

If an .asmx file is deployed in an ASP.NET AJAX-Enabled Web application, it can invoke methods of the service from JavaScript by adding a ServiceReference to the ScriptManager control in the .aspx file [this control is added automatically to the default.aspx page when a Web site is created in Visual Studio using the ASP.NET AJAX-enabled Web site template].

Embedding Web SErvice Methods

An alternative to building a complete .asmx file for your Web service methods is to embed the Web service methods directly in the page class.

This avoids having to build a complete Web service endpoint for the methods you want to call. Instead, the Web method can be exposed directly from a web page that is callable from client-side JavaScript by adding a server-side method to the page [either directly in the page or in the codebehind]; and annotating it with the WebMethod attribute.

This will allow it to be invoked via the client-side object PageMethods.

NOTE: these client-side proxies can only be generated from ASP.NET .asmx endpoints, Windows Communication Foundation .svc endpoints, or WebMethods embedded directly in a page, and are not a general mechanism for calling arbitrary Web services.