Solve the Page Waiting Game with Threaded AJAX : Page 2

ASP.NET offers a few solutions for handling long-running processes. One of the best methods is to combine threading with either a polling solution or AJAX.

by Jack D. Herrington

Oct 28, 2005

Page 2 of 3

Moving to Threads
A threading solution provides a much cleaner experience to the user because they get updates of the processing on a periodic basis. Those responses are easy to prepare so they come back instantly even though the processing in the background might take a while.

To handle the threading system I'll use two classes and one interface. The JobHandler singleton maintains a set of objects that implement the IJob interface. The JobHandler manages the threads for the system. When a job is added a new thread is created and the Start method is called on the job within a new thread. An ID string is returned that can then be used to lookup the job later.

The WeatherJob is an implementation of IJob that polls the weather from a specified set of airports and fills up a DataSet named Data that contains the weather reports.

The code for the JobHandler singleton is shown in Listing 2, which is pretty straightforward. The only interesting thing about it is the AddJob method that creates a new thread for the job and calls the Start method.

The interface for jobs is shown in Listing 3. The constructor sets up the data set for the job. And the Start method, through each of the airports, calls the web request and stores the returned data in the data set.

A Polling Solution
The first solution to monitoring the weather job is to use polling. To do that the page will post back to itself every two seconds. On the first page request the job will start. After that the page will monitor the output of the weather job by hooking up the data in the job to the data grid on the page. The relationship between the browser, the web server, and the thread is shown in Figure 4.

The HTML for the polling page is shown in Listing 4. The interesting part is the script block within the refreshScript label. When the label is visible the script will execute to re-submit the form two seconds after the page loads. That will refresh the data in the grid.

The code behind for the polled HTML is shown in Listing 5. The import code here is in the page_load method. If the request ID that is stored in the hidden form field is null or blank then this is the first time the page is loaded. The first time the page is loaded the job is created and the ID of the job is placed in the hidden form field.

After two seconds the Javascript will fire and the page will reload. The second time around the request ID will come through the hidden input field and the code will find the job with the specified ID and use the data to populate the data grid.