Time bar

  • Thread starter Thread starter simon
  • Start date Start date
S

simon

when I execute aspx page, it works about 5 minutes - I calculate some
statistics.

Is there some way, that I can show user time bar or smething similar? That
he nows, that page is working.

Thank you,
Simon
 
Use a javascript-based progress bar, show the progress bar when user fires
the event (like button click), then hide the progress bar.

Or you can consider a flash-based progress bar.
 
actually you are not the only one wanting to create a progressbar for an
asp.net page, have a look at these pages:

http://bernardstudios.com/archive/2004/05/25/259.aspx
http://javascript.internet.com/navigation/charging-link.html

But most do it using a Javascript based pageloader progressbar
Use a javascript-based progress bar, show the progress bar when user fires
the event (like button click), then hide the progress bar.

Or you can consider a flash-based progress bar.

:


--

+======================================================================+
| SparrowHawk The Magician |
| |
| |
| |
| |
+======================================================================+
| e-mail: sparvhok[NOSPAM]hotmail.com |
+======================================================================+
To send me an email, replace the [NOSPAM] tag with @ sign.
 
That's one of the options, only if you know how long you have to wait. But if
you have no idea how long is the process is going to be, go for the WinXp
style of progress bar, which what I try to meant here:

http://www.dynamicdrive.com/dynamicindex11/xpprogressbar.htm

hope its help
Thanks

WeiChung



SparvHok" <"sparvhok said:
actually you are not the only one wanting to create a progressbar for an
asp.net page, have a look at these pages:

http://bernardstudios.com/archive/2004/05/25/259.aspx
http://javascript.internet.com/navigation/charging-link.html

But most do it using a Javascript based pageloader progressbar
Use a javascript-based progress bar, show the progress bar when user fires
the event (like button click), then hide the progress bar.

Or you can consider a flash-based progress bar.

:


--

+======================================================================+
| SparrowHawk The Magician |
| |
| |
| |
| |
+======================================================================+
| e-mail: sparvhok[NOSPAM]hotmail.com |
+======================================================================+
To send me an email, replace the [NOSPAM] tag with @ sign.
 
I tried tis code example. I put his download file () into same folder and
added this to my page, but nothing displays.

what's missing ?



<script type="text/javascript" src="xp_progress.js">


<script type="text/javascript">
var bar1= createBar(320,15,'white',1,'black','green',85,7,3,'');
</script>
 
Hi TJS,

question 1, you miss a script tag in the first code "</script>"
question 2,
Where do you placed your code?

Suggestion of code placement
place this near the HTML header ( in the <HEAD> tag)
<script type="text/javascript" src="xp_progress.js"></script>

place this code exactly on the page location which you want it to show
<script type=text/javascript>
createBar(200,13,'white',1,'black','blue',85,7);
</script>

I advice that you code put it within a table , in the <td> tag, or in the
<Div> tag so that you could control its visibility.

Hope this helps

Thanks

weichung
 
I would like to see it running as a test for now, and there is some
progress.
I get the error message that "bA has no properties" and a display of an
empty white bar

my code is now:

<script language="javascript" src="xp_progress.js">

/***********************************************
* WinXP Progress Bar- By Brian Gosselin- http://www.scriptasylum.com/
* Script featured on Dynamic Drive- http://www.dynamicdrive.com
* Please keep this notice intact
***********************************************/

</script>

<script type="text/javascript">
var bar1=createBar(320,15,'white',1,'black','green',85,7,3,"");
</script>
 
I got it , the document .write needs a body tag

final example code is:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN">
<HTML>
<HEAD>
<META name="generator" content="HTML Tidy for Windows (vers 1st July
2004), see www.w3.org">
<SCRIPT language="javascript" src="xp_progress.js" type="text/javascript">
/***********************************************
* WinXP Progress Bar- By Brian Gosselin- http://www.scriptasylum.com/
* Script featured on Dynamic Drive- http://www.dynamicdrive.com
* Please keep this notice intact
***********************************************/
</SCRIPT>
<TITLE></TITLE>
</HEAD>
<BODY>
<SCRIPT type="text/javascript">
var bar1=createBar(320,15,'white',1,'black','green',85,7,3,"");
</SCRIPT>
</BODY>
</HTML>
 
GREAT,
it still depends on how you want to make it work.
May be you could give me your working scenario so that I could help out.

ehm, let me see, I give you scenario, let says,
user click a button on the aspx page to fire the long process,
you need to show the progess bar.

first, you populate the progress bar into a <Div> and set it to invisible by
default.

then use this script to activate the bar

var showBar = document.getElementById("tdBar");
showBar.style.display = "";

Then, after the process is complete, you invisible the <div> again.

by the following codes

var showBar = document.getElementById("tdBar");
showBar.style.display = "NONE";

but I assume that you know how to call a javascript from the server code.

Hope this help.

weichun
 
I'm testing two types in here a text as well as the image progess bars. For
now only the texrt is working. I can;t get the image to work.

==============================


<script runat = "server">
Private Sub Page_Load(sender As Object, e As System.EventArgs)
' Write div tag to the page that will contain the text for the progress
bar.
Response.Write("<div id='mydiv' >")
Response.Write(" - ")
Response.Write("</div>")

' Javascript to do the work of the progress bar.
' There are three functions.
' 1. ShowWait: Sets text of the div tag to "Loading" followed by 10
periods ".........."
' 2. StartShowWait: Calls the ShowWait function every second and make
the div tag visible.
' 3. HideWait: Hides the div tag when the page is done loading. It is
called from a script block
' that you need to add to the HTML page as the last element.

Response.Write ("<SCRIPT type=""text/javascript"">" & vbcrlf )
Response.Write (" document.getElementById('mydiv').innerHTML = '';" &
vbcrlf )
Response.Write (" var dots = 0;" & vbcrlf )
Response.Write (" var dotmax = 10;" & vbcrlf )
Response.Write (" function ShowWait(){" & vbcrlf )
Response.Write (" var output;" & vbcrlf )
Response.Write (" output = 'Loading';" & vbcrlf )
Response.Write (" dots++;" & vbcrlf )
Response.Write (" if(dots>=dotmax){dots=1};" & vbcrlf )
Response.Write (" for(var x = 0;x < dots;x++){" & vbcrlf )
Response.Write (" output += '.';" & vbcrlf )
Response.Write (" }" & vbcrlf )
Response.Write (" document.getElementById('mydiv').innerHTML = output;" &
vbcrlf )
Response.Write (" var
bar1=createbar(320,15,'white',1,'black','green',85,7,3,''); ")
Response.Write (" document.getElementById('bar').innerHTML = bar1;" &
vbcrlf )
Response.Write (" }" & vbcrlf )
Response.Write (" function StartShowWait(){" & vbcrlf )
Response.Write (" document.getElementById('mydiv').style.visibility =
'visible';" & vbcrlf )
Response.Write (" window.setInterval('ShowWait()',1000);" & vbcrlf )
Response.Write (" }" & vbcrlf )
Response.Write (" function HideWait(){" & vbcrlf )
Response.Write (" document.getElementById('mydiv').style.visibility =
'hidden';" & vbcrlf )
Response.Write (" window.clearInterval();" & vbcrlf )
Response.Write (" }" & vbcrlf )
Response.Write (" StartShowWait();" & vbcrlf )
Response.Write ("</SC" & "RIPT>" & vbcrlf )
Response.Flush()

dim s as string = ""
s &=("<div id='bar' >")
s &=(" <sc" & "ript type=""text/javascript"">")
s &=(" var
bar1=createbar(320,15,'white',1,'black','green',85,7,3,"");")
s &=(" </scr" & "ipt>")
s &=("</div>")
bar.text=s

' This really doesn't serve any purpose, other than to help with the
sample code.
' After 5 seconds, the page will stop loading and the progress bar will
disappear.\


Response.Write ("<SCRIPT type=""text/javascript"">" & vbcrlf )
Response.Write ("var showBar = document.getElementById(""bar1"");")
Response.Write ("showBar.style.display = "";")
Response.Write ("</SC" & "RIPT>" & vbcrlf )

System.Threading.Thread.Sleep(5000)

Response.Write ("<SCRIPT type=""text/javascript"">" & vbcrlf )
Response.Write (" var showBar = document.getElementById(""bar1"");")
Response.Write (" showBar.style.display = ""NONE"";")
Response.Write ("</SC" & "RIPT>" & vbcrlf )

End Sub 'Page_Load
</script>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN">
<HTML>
<HEAD>
<SCRIPT language="javascript" src="xp_progress.js"
type="text/javascript"></SCRIPT>
<TITLE>Progress Bar Test</TITLE>
</HEAD>

<body>

<div id="bar1">
<asp:label id="bar" runat="server" />
</div>

<form name="Form1" method="post" action="Progressbar.aspx" id="Form1">
<!-- All you form data goes here -->
xxxxxxxxxxxx
</form>
<!-- Add this script block as the last element in your document. It will
hide the progress bar when the page loads -->
<script type="text/javascript">
HideWait();
</script>

</body>
 
Back
Top