Odtnhj

I have a counter on my page that displays the idle time left for a session.
The counter should not always be visible. But when hiding it an exception is thrown although the Javascript that feeds the counter should not be executed in this case:

The C# Code:

protected void Page_Load(object sender, EventArgs e)
{
 if(DIV_Countdown.Visible == true)
 
 ClientScript.RegisterStartupScript(this.GetType(), "Countdown", "SessionCountdown();", true);
 

The Javascript:

<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<script type="text/javascript">
 function SessionCountdown() 
 var seconds = 60;
 $get("<%=LBL_Countdown.ClientID %>").innerHTML = seconds;

 setInterval(function () 
 seconds--;
 $get("<%=LBL_Countdown.ClientID %>").innerHTML = seconds;
 , 1000);

 setTimeout(function () 
 window.location = "http://essbp1s8000/RRHH/Default.aspx";
 , seconds * 1000);
 
</script>

The markup:

<div id="DIV_Countdown" runat="server" visible="true">Session expires in <asp:label id="LBL_Countdown" runat="server"/ seconds.</div>

This works perfect until I switch DIV_Countdown.Visible to false.
JavaScript runtime error: Unable to set property 'innerHTML' of undefined or null reference

This sounds like a page lifecycle problem. If you are setting the visibility of the div on some postback method, it's too late for the Page_Load-event to see that. The Page_Load-event would have been executed before you set the visibility, hence the javascript has been registered already.

I recommend moving the script-block inside the div in the markup so that it can only run if the element is infact visible. That way all you need to worry about it the visibility of the div:

<div id="DIV_Countdown" runat="server" visible="true">
 Session expires in
 <asp:Label ID="LBL_Countdown" runat="server" />
 seconds.

 <script type="text/javascript">
 function SessionCountdown() 
 var seconds = 60;
 $get("<%=LBL_Countdown.ClientID %>").innerHTML = seconds;

 setInterval(function () 
 seconds--;
 $get("<%=LBL_Countdown.ClientID %>").innerHTML = seconds;
 , 1000);

 setTimeout(function () 
 window.location = "http://essbp1s8000/RRHH/Default.aspx";
 , seconds * 1000);
 

 SessionCountdown();
 </script>
</div>

Also if you only need to use the label in the client side (not in server code) I would change that to a

<span id="myCountdown"></span>

It would make the javascript code much cleaner:

document.getElementById("myCountDown").innerHTML...