Display div for few seconds and disappear using asp.net code behind

Question

protected void Page_Load(object sender, EventArgs e)
        {
            if(!Page.IsPostBack)
                divStatus.Visible = true;
                Page.ClientScript.RegisterStartupScript(this.GetType(), "somekey", "function autoHide(){ setTimeout(function() {document.getlementById('" + divStatus.ClientID + "').style.display='none';},5000);};", true); 
        }

  <form id="form1" runat="server">
    <div>
    <div class="success" id="divStatus" runat="server" visible="false" >sssssssssssssssss</div>

    </div>
    </form>

what exactly do i need to add in order to fadeout by itself after few seconds? currently i am displaying div but the user have to click explcitly to close the div and is there a way to close the div by itself using asp.net?

yes i know it does work with fadein and fadeout if you provide the timer but it does not work with asp.net code behind.

//html:

 <div class="success" id="divStatus" runat="server" visible="false" ></div>

//code behind:

protected void lnkbtn_add_Click(object sender, EventArgs e)
{
       ........//more code for deleting
       if (deleted)
       {
           divStatus.visible = true;
       }
}

}

Answer 1

Yes i know it does work with fadein and fadeout if you provide the timer but it does not work with asp.net code behind.

There's no difference. ASP.NET controls render as regular html controls. My hunch is that you are not using the proper client ID that's rendered. You have two choices:

• Add ClientIDMode="static" in your markup as so:

  <div clientidmode="static" class="success" id="divStatus" runat="server" visible="false" ></div>
  

And then add the javascript function to automatically hide the div:

function autoHide()
{  //hide after 5 seconds
   setTimeout(function(){document.getlementById('divStatus').style.display='none';},5000);
}

• simply use <%=divStatus.ClientID%> to get the client id that's ultimately rendered on the page as so:

  function autoHide() {  //hide after 5 seconds   
    setTimeout(function() {document.getlementById('<%=divStatus.ClientID%>').style.display='none';},5000);
  }
  

From codebehind, you can simply call:

 ........//more code for deleting
Page.ClientScript.RegisterStartupScript(this.GetType(),"somekey","autoHide();",false);

UPDATE

If you want to even define the autoHide function in code behind, do as follows (note that the last parameter is true in this case, as opposed to false on the previous example):

 ........//more code for deleting
string script = @"document.getElementById('" + divStatus.ClientID + "').innerHTML='You are done!' ;setTimeout(function(){document.getElementById('" + divStatus.ClientID + "').style.display='none';},5000);";
Page.ClientScript.RegisterStartupScript(this.GetType(), "somekey", script, true);