Software Developer's Resources

Shopping Cart Systems
Mobile Text Marketing Solutions
Online Backup Solutions
ASP.NET Web Development
Skip Navigation Links.

How to make a control invisible.

This article describes how to make a web control or user control invisible on the web page, but still reside in the HTML Document Object Model (DOM).

If you set Visible="True" the control will not appear on the web and will not be listed in the HTML document object model.

In some cases we want to use the functionality of the web control via JavaScript but we do not want the user to see the control on the web page.

We'll use the CSS style attributes display and visibility to hide the web control:

    <asp:Button Id="TimeAdd" Style="display: none;visibility: hidden;" Text="Submit" runat="server" />

You'll notice that the Button web control doesn't have a style attribute. ASP.NET will pass the attribute and value to the browser "as-is".

The resulting HTML is:

    <input type="button" name="TimeAdd" value="TimeAdd"
     onclick="javascript:__doPostBack('TimeAdd','')" id="TimeAdd"
     style="display: none;visibility: hidden;" />