This seems to be such a simple problem. But I feel very challenged. I am almost there...but little help is needed.

When the form loads the text box is not visible. The way I did this was, in the page load event , I did TextBox1.Style.Add("display","none").

That way, the text box control is rendered in the page. And when the user clicks on a button, the text box control should become visible.

With the code below, unless I click on the button twice, the text box doesn't appear:

Code:
%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Javascript_controlvisibility.aspx.cs" Inherits="FHLBSF.QRMDMS.WebUI.Javascript_controlvisibility" %> 
 
<!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>Help me</title> 
     
    <script type="text/javascript"> 
        function toggleVisibility(controlId1) { 
             
            var control1 = document.getElementById(controlId1); 
 
 
            control1.style.display = ""; 
 
            if (control1.style.visibility == "visible" || control1.style.visibility == "") { 
                 
                control1.style.visibility = "hidden"; 
            } 
            else { 
                 
                control1.style.visibility = "visible"; 
            } 
 
 
                 
                 
        }     
    </script> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <div> 
    <div>     
           <asp:TextBox ID="TextBox1" runat="server" >textbox1</asp:TextBox>    
         
        <input type="button" ID="btnShowHide" value="Show/Hide" onclick="toggleVisibility('TextBox1');" /> 
    </div> 
    </div> 
    </form> 
</body> 
</html>
Any help is greatly appreciated.
thanks
nath