ASP.NET control with visible=false cannot be used in javascript?

Question

I have an ASP.NET text control "FromDate" whose visible property is set to false, but I wanted a client side javascript to be able to toggle the visibility property using CSS properties

element1.style.display = "none"; // hides the element
element1.style.display = ""; // shows the element

but when I attempt to get the textbox, I get null on

  var element1 = document.getElementById("FromDate");

When I try the same code with visble=true as the default on the "FromDate" ASP.NET control, it works (although that is not the behavior I need)

Any ideas?

Answer 1

When you set Visible = false to a control, it is not rendered. That means there is no HTML representation of that control sent to the page. Set the style only.

You can set the style as display: none from server side code like this:

FromDate.Style.Add(HtmlTextWriterStyle.Display, "none")