how to set visible true and false for drop down list box using javascript in asp.net

Question

<asp:DropDownList ID="ddloption" runat="server" Visible="false">
  <asp:ListItem Text="Active" Value="Active"></asp:ListItem>
  <asp:ListItem Text="D-Active" Value="D-Active"></asp:ListItem>
</asp:DropDownList>

function boxchange(dd)
{
  document.getElementById("<%= ddloption.ClientID%>").visibility = "visible";
}

ddloption is null, what i m getting...can you tell me how to work with this.

Answer 1

try

 function boxchange(dd)
 {
    var control = document.getElementById("<%= ddloption.ClientID %>");
    if (control != null)
       control.style.visibility = "visible";
 }

Nick is right, didn't even notice.

Answer 2

When you have a runat="server" visible="false" asp control, it is not rendered in the html. Try something like this:

<div id="wrapper" style="display: none;">
    <asp:DropDownList ID="ddloption" runat="server">
        <asp:ListItem Text="Active" Value="Active"></asp:ListItem>
        <asp:ListItem Text="D-Active" Value="D-Active"></asp:ListItem>
    </asp:DropDownList>
</div>


function boxchange(dd)
    {
          document.getElementById("wrapper").style.display = "block";
    }

Answer 3

To hide the dropdown

  document.getElementById("<%= ddloption.ClientID%>").Style.display='none';

To Show it again:

document.getElementById("<%= ddloption.ClientID%>").Style.display='';

Cheers