We often find we have some processes that take a while to run, and we want to give the user a good feedback mechanism of progress, showing which step we have reached. Here's a simple version of the progress indicator I created and what it looks like as it progresses and if one of the tasks fails.
We'll be using the following technologies to build this indicator:
- jQuery for browser-side script
- JSON to pass data from the web server to the browser and Scott Guthrie's JSON Extension for .NET 3.5 to convert our data into JSON
- User Control
Here's how the indicator works. The UserControl makes a browser-side query to an ASHX file for the list of possible tasks in the progress list. That ASHX returns a JSON list of objects defining the process. After, we call the web server for each of the steps and wait until either that step succeeds, fails or a timeout is reached. The web server then returns another JSON object determining the status for that step. The attached files (VS 2008, .NET 3.5) have four steps but could be converted for any number of steps. For each step in this example, we simply wait for 2 seconds and then return, so you can replace the wait with whatever check you need.