An ASP. NET progress bar

1. Create a progress bar:

<DIV id = "Lay1" style = "Z-INDEX: 1; LEFT: 1%; VISIBILITY: hidden; WIDTH: 99%; CURSOR: crosshair; POSITION: absolute; TOP: 32px; HEIGHT: 95%; BACKGROUND-COLOR: # ffffff "> <FONT face =" "> </FONT> <FONT face = ""> </FONT> <br> <B> <font color = "#800080" size = "2"> & nbsp; & nbsp; retrieving data. Please wait... </font> </B> <Table align = "center"> <Tr> <Td> <Div style = "BORDER-RIGHT: black 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: black 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 8pt; PADDING-BOTTOM: 2px; BORDER-LEFT: black 1px solid; PADDING-TOP: 2px; BORDER-BOTTOM: black 1px solid "> <span id =" progress1 "> & nbsp; </span> <Span id = "progress2"> & nbsp; </span> <span id = "progress3"> & nbsp; </span> <span id = "progress4"> & Nbsp; </span> <span id = "progress5"> & nbsp; </span> <span id = "progress6"> & nbsp; </span> <Span id = "progress7"> & nbsp; </span> <span id = "progress8"> & nbsp; </span> <span id = "progress9"> & Nbsp; </span> <span id = "progress10"> & nbsp; </span> <span id = "progress11"> & nbsp; </span> <Span id = "progress12"> & nbsp; </span> <span id = "progress13"> & nbsp; </span> <span id = "progress14"> & nbsp; </span> <span id = "progress15"> & nbsp; </span> </Div> </Td> </Tr> </Table> <Script language = "javascript"> Var progressEnd = 15; // set to number of progress <span>'s. Var progressColor = 'blue'; // set to progress bar color Var progressInterval = 300; // set to time between updates (milli-seconds) Var progressAt = progressEnd; Var progressTimer; Function progress_clear (){ For (var I = 1; I <= progressEnd; I ++) document. getElementById ('progress' + I). style. backgroundColor = 'transparent '; ProgressAt = 0; } Function progress_update (){ ProgressAt ++; If (progressAt> progressEnd) progress_clear (); Else document. getElementById ('progress' + progressAt). style. backgroundColor = progressColor; Progresstout = setTimeout ('Progress _ update () ', progressInterval ); } Function progress_stop (){ ClearTimeout (progresstout ); Progress_clear (); } // Progress_update (); // start progress bar </Script> </DIV>

2. Set query button attributes

Private Sub Page_Load (ByVal sender As System. Object, ByVal e As System. EventArgs) Handles MyBase. Load 'User code to place the initialization page here If Not IsPostBack But_find.Attributes.Add ("onClick", "Lay1.style. visibility =''; progress_update ();") End If End Sub

3. Register a javascript script

Public Sub scriptjdt (ByVal objPage As System. Web. UI. Page, ByVal strValue As String) Dim jb As String Jb = "<script language = 'javascript '>" + strValue + "</script>" ObjPage. RegisterStartupScript ("jdt_ OK", jb) End Sub

4. Click the query button to call

Private Sub but_find_Click (ByVal sender As System. Object, ByVal e As System. EventArgs) Handles but_find.Click 'Query data code '---------------- Me. scriptjdt (Me, "Lay1.style. visibility = 'den den '; progress_stop ();")' Close the progress bar code End Sub