We need you!

We're working hard on the next version of Developer Fusion. Let us know what you think we should be up to!

Members

Technology Zones

Articles

Hosted By

MaximumASP

Info

Rated
Read 27,476 times

Related Categories

How to simulate a status bar in a Web application

If you have a process that takes over 20 seconds or so on a Web application, you may want to let the user know the status of the process, e.g. if the user clicks a button to send out e-mails to 50 people, you may want to report to him on the screen when each e-mail goes out (probably about 1 per second) so that he knows there is progress taking place.

The problem with this is that web applications don't work in real time, instead the server finishes a process then sends out code to the client. However, with a little JavaScript, the ability to write and read to text files, and the ability to include files, you can create a simple process to keep the user abreast of the status of a process. This example was written in ASP.NET but you could probably recreate the concept it in any script language: basically it creates a page that refreshes itself every 10th second (constantly) and this page is RECREATED everytime the status changes, hence the user sees the change in status as your process runs.

StatusBar.aspx
-----------------------------
<%@ Page Language="C#" Debug="true" %>
<%@ import Namespace="System.IO" %>
<%@ import Namespace="System.Threading" %>
<script runat="server">
    const int NUMBER_OF_ITEMS_TO_PROCESS = 10;
   
    void Page_Load(Object sender, EventArgs e) {
   
        //Thread.Sleep(1000);
        UpdateStatus(GetCounter());
        SetCounter(GetCounter() + 1);
        if(GetCounter() > NUMBER_OF_ITEMS_TO_PROCESS) {
            Response.Redirect("Finished.aspx");
        }
    }
   
   
    private void UpdateStatus(int counter) {
        FileInfo fi = new FileInfo(HttpContext.Current.Server.MapPath("status.htm"));
        StreamWriter sw = fi.AppendText();
        if(counter < NUMBER_OF_ITEMS_TO_PROCESS) {
            sw.WriteLine(counter + ", ");
        } else {
            sw.WriteLine(counter + ".");
        }
        sw.Flush();
        sw.Close();
    }
   
   
   
    public void SetCounter(int counter) {
        FileInfo fi = new FileInfo(HttpContext.Current.Server.MapPath("Counter.txt"));
        StreamWriter sw = fi.CreateText();
        sw.WriteLine(counter.ToString());
        sw.Flush();
        sw.Close();
    }
   
    public int GetCounter() {
        FileInfo file = new FileInfo(HttpContext.Current.Server.MapPath("Counter.txt"));
        StreamReader sr = file.OpenText();
        int counter = Int32.Parse(sr.ReadLine());
        sr.Close();
        return counter;
    }
</script>
<html>
    <head>
        <meta http-equiv="refresh" content=".1">
    </head>
    <body>
    </body>
</html>
<!--#include file="status.htm" -->


StartProcess.aspx
-------------------------------------------------
<%@ Page Language="C#" %>
<%@ import Namespace="System.IO" %>
<script runat="server">
    void Page_Load(Object sender, EventArgs e) {
        ClearStatus();
        SetCounter(1);
        Response.Redirect("StatusBar.aspx");
    }
   
    private void ClearStatus() {
        FileInfo fi = new FileInfo(HttpContext.Current.Server.MapPath("status.htm"));
        StreamWriter sw = fi.CreateText();
        sw.WriteLine("Processing 10 Records...<br><br>");
        sw.Flush();
        sw.Close();
    }
   
    public void SetCounter(int counter) {
        FileInfo fi = new FileInfo(HttpContext.Current.Server.MapPath("Counter.txt"));
        StreamWriter sw = fi.CreateText();
        sw.WriteLine(counter.ToString());
        sw.Flush();
        sw.Close();
    }
</script>
<html>
    <head>
    </head>
    <body>
        <form runat="server">
            <!--#include file="status.htm" -->
            <br>
            Process is finished.<br>
            <br>
            <a href="StartProcess.aspx">Start process again</a>.
        </form>
    </body>
</html>



Finished.aspx
--------------------------------------------
<%@ Page Language="C#" %>
<%@ import Namespace="System.IO" %>
<html>
    <head>
    </head>
    <body>
        <form runat="server">
            <!--#include file="status.htm" -->
            <br>
            Process is finished.<br>
            <br>
            <a href="StartProcess.aspx">Start process again</a>.
        </form>
    </body>
</html>



Counter.txt
-----------------------------
1

Edward Tanguay updates his personal web site tanguay.info weekly with code, links, quotes and thoughts on web development. Sign up for the free newsletter.

Comments

  • re PK

    Posted by JunMa on 04 Nov 2005

    I tried and it works. The htm file could be any htm files that you want write the status to. You can even use a blank htm page.

    However, I don't think the status is that neat and probably you ne...

  • re PK

    Posted by JunMa on 04 Nov 2005

    I tried and it works. The htm file could be any htm files that you want write the status to. You can even use a blank htm page.

    However, I don't think the status is that neat and probably you nee...

  • How to simulate statusbar in a web application

    Posted by PK on 01 Sep 2005

    Hi, I am not sure of following your code.
    You indcluded .htm file. but where is it to copy, if I want to try your code.
    My requirement is that in asp.net application, I am getting 600 customer ids. ...