ASP.NET - hi not able to hide image in updateprogress

Asked By Chinnarasu .M on 28-Jul-11 03:03 AM
i used code like this..but in if condition become failure to hide...

<asp:UpdateProgress runat="server"  id="PageUpdateProgress">

<ProgressTemplate>
    <asp:Image ID="Image1" ImageUrl="~/ajax_loader.gif" runat="server" />
Loading...

</ProgressTemplate>

</asp:UpdateProgress>

<asp:UpdatePanel runat="server" id="Panel">

<ContentTemplate>

<asp:Button runat="server" id="UpdateButton" onclick="UpdateButton_Click" text="Update" />

</ContentTemplate>

</asp:UpdatePanel>
in .cs file..

foreach (Control image in UpdateProgress2.Controls)
{
     if   (image!=null)
    {   
     if (image is Image)
     {
      ((Image)image).Visible = false;
     }
    }
}
Ravi S replied to Chinnarasu .M on 28-Jul-11 03:06 AM
HI

Please find the code below which runs perfectly.

In form tag, place below code

 <div id="bodyloader">
       
<div class="bodyloader">
           
<img src="images/bodypreloader.gif" width="64" height="64" alt="Loading" /><br />
            Please wait while generating contents
</div>
   
</div>

Now, in the body call below function

<body onload="hideBodyloader();">

Find the hideBodyloader(); below.

function hideBodyloader(){
document
.getElementById("bodyloader").style.display="none";
}
Reena Jain replied to Chinnarasu .M on 28-Jul-11 03:08 AM
Hi,

Here is a non-ProgressTemplate way, using client-side event handlers:

<script type="text/javascript">
Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(BeginRequestHandler);
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
 
function BeginRequestHandler(sender, args)
{
   // some code to show image, e.g:
   document.getElementById('somedivwhichasimage').className = 'show';
}
 
function EndRequestHandler(sender, args)
{
   // some code to hide image, e.g:
   document.getElementById('somedivwhichasimage').className = 'hidden';
}
</script>

Hope this will help you
Riley K replied to Chinnarasu .M on 28-Jul-11 03:12 AM
You can access the image which is in update progress

In code behind write this code

You have to use the FindControl Method find the Image

protected void Page_Load(object sender, EventArgs e)
{
 System.Web.UI.WebControls.Image img = (System.Web.UI.WebControls.Image)UpdateProgress1.FindControl("Image2");
 
  if (img != null)
{
    //Write your code here
}
}
Chinnarasu .M replied to Reena Jain on 28-Jul-11 03:13 AM
hi thanks for u r help..but how can i call this function in my ddl selected index chage event..????
Chinnarasu .M replied to Riley K on 28-Jul-11 03:21 AM
hi i used u r code in ddlselected index change like this..but after hiding also i can visible image..

  System.Web.UI.WebControls.Image img = (System.Web.UI.WebControls.Image)UpdateProgress2.FindControl("Image2");

      if (img != null)
      {
        img.Visible = false;
      }
      //up.Visible = false;
      //HtmlGenericControl div = (HtmlGenericControl)Page.FindControl("up1");
      ////to hide
      //div.Style.Add("Visibility", "hidden");
      System.Threading.Thread.Sleep(5000);
dipa ahuja replied to Chinnarasu .M on 28-Jul-11 03:23 AM
Check this,, its working perfectly

<asp:UpdateProgress runat="server" ID="UpdateProgress1">
<ProgressTemplate>
  <div id="spinner1" style="border2px;" align="left">
    <asp:Image ID="Image1" runat="server" ImageUrl="loading-icon.gif" /><br />
    <asp:Image ID="Image2" runat="server" ImageUrl="loading-icon.gif" />
    </div>
</ProgressTemplate>
</asp:UpdateProgress>
 
<asp:UpdatePanel runat="server" ID="Panel">
<ContentTemplate>
<asp:Button ID="Button2" runat="server" Text="Display" OnClick="Button2_Click"
  />
</ContentTemplate>
</asp:UpdatePanel>

.CS Code
protected void Button2_Click(object sender, EventArgs e)
{
  Image Image1 = UpdateProgress1.FindControl("Image1"as Image;
  if (Image1 != null)
  {
    Image1.Visible = false;
  } 
  System.Threading.Thread.Sleep(3000);
 
}

//But if you paste the same code in Page Render event like this, Image control could be found.  
 
protected override void Render(HtmlTextWriter writer)
{
  Image Image1 = UpdateProgress1.FindControl("Image1"as Image;
  if (Image1 != null)
  {
    Image1.Visible = false;
  }
  base.Render(writer);
}
Hope this will help you!
Chinnarasu .M replied to dipa ahuja on 28-Jul-11 04:45 AM
hi..just check this ...i used u r same method..but after hiding image in .cs page..image is visible...

<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!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">
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <div>
    <asp:UpdateProgress runat="server" ID="UpdateProgress1">
<ProgressTemplate>
  <div id="spinner1" style="border: 2px;" align="left">
    <asp:Image ID="Image1" runat="server" ImageUrl="~/ajax_loader.gif" /><br />
    <asp:Image ID="Image2" runat="server" ImageUrl="~/ajax_loader.gif" />
    </div>
</ProgressTemplate>
</asp:UpdateProgress>
 
<asp:UpdatePanel runat="server" ID="Panel">
<ContentTemplate>
<asp:Button ID="Button2" runat="server" Text="Display" onclick="Button2_Click1" />
</ContentTemplate>
</asp:UpdatePanel>
    </div>
    </form>
</body>
</html>

in .cs page..

protected void Button2_Click1(object sender, EventArgs e)
    {
      Image Image1 = UpdateProgress1.FindControl("Image1") as Image;
      if (Image1 != null)
      {
        Image1.Visible = false;
      }
      System.Threading.Thread.Sleep(3000);
    }
dipa ahuja replied to Chinnarasu .M on 28-Jul-11 04:50 AM
have you added this:

protected override void Render(HtmlTextWriter writer)
{
  Image Image1 = UpdateProgress1.FindControl("Image1"as Image;
  if (Image1 != null)
  {
  Image1.Visible = false;
  }
  base.Render(writer);
}
Jitendra Faye replied to Chinnarasu .M on 28-Jul-11 06:09 AM
In your code Image Control in server control, then why you are finding it in UpdateProgress,

<asp:UpdateProgress runat="server" ID="UpdateProgress1">
<ProgressTemplate>
  <div id="spinner1" style="border: 2px;" align="left">
    <asp:Image ID="Image1" runat="server" ImageUrl="~/ajax_loader.gif" /><br />
    <asp:Image ID="Image2" runat="server" ImageUrl="~/ajax_loader.gif" />
    </div>
</ProgressTemplate>
</asp:UpdateProgress>

Change Your code like this-

protected void Button2_Click1(object sender, EventArgs e)
    {
    Image1.Visible = false;
    }

try and let me know.