A Basic Example
The following steps will guide you through creating your first Ajax.NET Framework application. While this example may seem basic in nature, it highlights the necessary steps to get your site up and running with the framework.
Hello World Application
The first example will implement a simplistic "Hello World" application. To begin, you may choose to download the sample code
If you have yet to download the Ajax.NET Framework, please download it now
. After you download the package, extract the contents into a folder that you can easily access.
shows how the message looks.
Step 1: Create a Web Project and Reference Ajax.DLL
|Figure 1: A Simple Message: The Hello World application displays a message to the user.|
First, create a new Web project in Visual Studio 2003 to host your application. In your new project, right-click on References and select Add Reference. Navigate to the Ajax.dll
file and set a reference in your project to the Ajax.NET Framework.
Step 2: Add the HttpHandler in Web.config
Next update your web.config
with a new HttpHandler. Adding this handler will allow requests sent back to the application to be interrogated to see if they are designated as "Ajax.NET" requests. If the requests require processing from the Ajax.NET Framework, the request is caught at this step and processed by the framework.
You can easily add the entry to your web.config using the following code snippet. Place the httpHandlers
node directly after the opening element of the system.web
node as shown below.
Step 3: Register Page as an "Ajax Type"
PageHandlerFactory, Ajax" />
The next step signals to the application that the individual page you are working on must be processed through the Ajax.NET Framework. In the Page_Load
event method you will add the following code.
public class WebForm1 :
private void Page_Load(object
sender, System.EventArgs e)
In this instance the class name is WebForm1. Notice that you pass in the class name of the page to the method RegisterTypeForAjax
using the typeof
Step 4: Create Your Method
When you create the method, decorate it with the AjaxMethod Attribute to create a method that will return data to the browser.
public string SayHi()
return "Hello World!";
Step 5: Write HTML to Call the Code-behind Method
Create some HTML that allows the user to initiate the call to the server. This code will render a link on the page. When the user clicks this link, the browser will contact the server and run the SayHi
method. This example defines a callback method so when a response is sent back from the server, the SayHi_CallBack
method runs. The SayHi_CallBack
Add the code in the following snippet somewhere between the BODY tags in your HTML document.
Make sure to not
include the parenthesis at the end of the method name when defining your callback in the originating method. Add the code in the following snippet within the HEAD
tag of your document.
How Does this All Work?
When a user clicks the "Click Here" link, the designated method is called on the server. The server does its processing and then flags the system that a response is ready. When the browser recognizes a response from the server, the callback method is invoked and the response (with the interface of the proxy) is passed as an argument.
In this case, the code-behind method SayHi
returns a string so the proxy's value property is simply the string value returned by the method.