|
Rank: Newbie Groups: Member
Joined: 10/26/2007 Posts: 5
|
I have very successfuly implemented your progress bar on our web pages, very nice. I can't figure out how to hide this object and then make it visible when the button event is triggered. Can you help? Thanks
|
|
Rank: Administration Groups: Administration
Joined: 5/27/2007 Posts: 24,217
|
Hi Bob, Have you tried to put it inside a DIV and then hide that DIV?
Code: HTML/ASPX
<div id="div1">
...progress bar goes here
</div>
You can then hide it by:
Code: JavaScript
document.getElementById("div1").style.display = "none";
Thanks
|
|
Rank: Newbie Groups: Member
Joined: 10/26/2007 Posts: 5
|
Hey thanks for the quick response! Sorry for being new to this, but where does the javascript go? I'm running a vb code behind page and thought something would work in the vb code on the button event, not so. Thanks so much for you help!
|
|
Rank: Administration Groups: Administration
Joined: 5/27/2007 Posts: 24,217
|
Oh. If you want to do that on the server side then you would just set the ProgressBar's Visible to False in your code. Sorry I thought you meant client side. :)
|
|
Rank: Newbie Groups: Member
Joined: 10/26/2007 Posts: 5
|
Ok, I put that to my test example and it almost works. The first time I click the button, the progress bar becomes visible but does not count up. If I click the button again it works fine. More times also works, but never the first. I must be missing something, below is the test code base on your site test example:
DEFAULT5.ASPX-------------------------------- <%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default5.aspx.vb" Inherits="Default5" %>
<%@ Register Assembly="EO.Web" Namespace="EO.Web" TagPrefix="eo" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" > <head runat="server"> <title>Untitled Page</title> </head> <body> <form id="form1" runat="server"> <div id="div1"> <eo:ProgressBar ID="ProgressBar1" runat="server" BackgroundImage="00060301" BackgroundImageLeft="00060302" BackgroundImageRight="00060303" ControlSkinID="None" IndicatorImage="00060304" ShowPercentage="True" StartTaskButton="Button1" Value="0" Width="250px" Visible="False"> </eo:ProgressBar> </div> <asp:Button ID="Button1" runat="server" Text="Button" /> </form> </body> </html>
DEFAULT5.ASPX.VB---------------------
Partial Class Default5 Inherits System.Web.UI.Page
Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button1.Click ProgressBar1.Visible = True End Sub
Protected Sub ProgressBar1_RunTask(ByVal sender As Object, ByVal e As EO.Web.ProgressTaskEventArgs) Handles ProgressBar1.RunTask ProgressBar1.Maximum = 100
System.Threading.Thread.Sleep(100) Dim i As Integer For i = 0 To 100 'Stop the task as soon as we can if the user has 'stopped it from the client side If e.IsStopped Then Exit For End If
'Here we call Thread.Sleep just for demonstration 'purpose. You should replace this with code that 'performs your long running task. System.Threading.Thread.Sleep(100)
'You should frequently call UpdateProgress in order 'to notify the client about the current progress e.UpdateProgress(i) Next i End Sub
End Class
Thanks again and sorry I can't identify the problem myself!
|
|
Rank: Administration Groups: Administration
Joined: 5/27/2007 Posts: 24,217
|
Hi Bob, I see what you mean. It will never work that way. You can not have the same button doing two things. Specifically, you can not have the buttom that starts the progress bar task to also do other things --- in your case, to show the progress bar. In order to achieve what you want to do, you must rely on our client side JavaScript interface. The following code gives you a working example:
Code: HTML/ASPX
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default4.aspx.cs" Inherits="Default4" %>
<%@ Register Assembly="EO.Web" Namespace="EO.Web" TagPrefix="eo" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
<script type="text/javascript">
function start_progressBar()
{
//Display the progress bar
var div = document.getElementById("pbDiv");
div.style.display = "block";
//Start the progress bar
var pb = eo_GetObject("ProgressBar1");
pb.startTask();
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div id="pbDiv" style="display:none">
<eo:ProgressBar ID="ProgressBar1" runat="server" BackgroundImage="00060401" BackgroundImageLeft="00060402"
BackgroundImageRight="00060403" ControlSkinID="None" IndicatorImage="00060404"
ShowPercentage="True" Value="30" Width="250px" ClientSideOnValueChanged="on_pb_value_changed" StartTaskButton="Button1" OnRunTask="ProgressBar1_RunTask">
</eo:ProgressBar>
</div>
<input type="button" onclick="start_progressBar()" value="Start" />
</form>
</body>
</html>
Thanks
|
|
Rank: Newbie Groups: Member
Joined: 10/26/2007 Posts: 5
|
This exposes the progress bar fine, but it loops through 100% twice????
Code: HTML/ASPX
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default5.aspx.vb" Inherits="Default5" %>
<%@ Register Assembly="EO.Web" Namespace="EO.Web" TagPrefix="eo" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
<script type="text/javascript">
function start_progressBar()
{
//Display the progress bar
var div = document.getElementById("pbDiv");
div.style.display = "block";
//Start the progress bar
var pb = eo_GetObject("ProgressBar1");
pb.startTask();
}
function hide_progressBar()
{
//Display the progress bar
var div = document.getElementById("pbDiv");
div.style.display = "none";
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div id="pbDiv" style="display:none">
<eo:ProgressBar ID="ProgressBar1" runat="server" BackgroundImage="00060401" BackgroundImageLeft="00060402"
BackgroundImageRight="00060403" ControlSkinID="None" IndicatorImage="00060404"
ShowPercentage="True" Value="30" Width="250px" ClientSideOnValueChanged="on_pb_value_changed" StartTaskButton="Button1" OnRunTask="ProgressBar1_RunTask">
</eo:ProgressBar>
</div>
<input type="button" onclick="start_progressBar()" value="Start" />
</form>
</body>
</html>
Code: Visual Basic.NET
Partial Class Default5
Inherits System.Web.UI.Page
Protected Sub ProgressBar1_RunTask(ByVal sender As Object, ByVal e As EO.Web.ProgressTaskEventArgs) Handles ProgressBar1.RunTask
ProgressBar1.Maximum = 100
System.Threading.Thread.Sleep(100)
Dim i As Integer
For i = 0 To 100
'Stop the task as soon as we can if the user has
'stopped it from the client side
If e.IsStopped Then
Exit For
End If
'Here we call Thread.Sleep just for demonstration
'purpose. You should replace this with code that
'performs your long running task.
System.Threading.Thread.Sleep(100)
'You should frequently call UpdateProgress in order
'to notify the client about the current progress
e.UpdateProgress(i)
Next i
ProgressBar1.StopTaskButton = True
End Sub
End Class
Sorry for not being able to complete this and your help is really appreciated!
|
|
Rank: Administration Groups: Administration
Joined: 5/27/2007 Posts: 24,217
|
Hi Bob, The event handler has been hooked up twice. Once in your .aspx file:
Code: HTML/ASPX
<eo:ProgressBar ... OnRunTask="ProgressBar1_RunTask">
</eo:ProgressBar>
Once in your code with "ProgressBar1.RunTask":
Code: Visual Basic.NET
Protected Sub ProgressBar1_RunTask(
ByVal sender As Object, ByVal e As EO.Web.ProgressTaskEventArgs)
Handles ProgressBar1.RunTask
Remove any one of them should put it back to normal. Thanks
|
|
Rank: Newbie Groups: Member
Joined: 10/26/2007 Posts: 5
|
Thank you very much, it works great. Nice products, I'll look forward to implemnting more of your products in the future!
|
|