I have asp:panel on my page. At run time, I add controls to this panel, and I want to disable/enable all its controls as per business logic.

I tried with this:

document.getElementById('mypanel').disabled = true;

But it is not working.

Does anyone has any idea to make this work?

I have asp:panel on my page. At run time, I add controls to this panel, and I want to disable/enable all its controls as per business logic.

I tried with this:

document.getElementById('mypanel').disabled = true;

But it is not working.

Does anyone has any idea to make this work?

• javascript
• asp

Share Improve this question Follow edited Jul 9, 2012 at 7:14 nhahtdh 56.8k1515 gold badges129129 silver badges164164 bronze badges asked Feb 23, 2011 at 8:03 BreakHeadBreakHead 10.7k3939 gold badges120120 silver badges169169 bronze badges 2

• Do/Can you use the jQuery framework? – The Scrum Meister Commented Feb 23, 2011 at 8:16
• Note that if you disable form elements, their value won't be sent to the server when posting back the data. If you want the value to be sent, assign their readOnly property instead. – Shadow Wizzard Commented Feb 23, 2011 at 8:46

Add a ment  | 

5 Answers 5

Sorted by: Reset to default 9

An asp:Panel just produces a div element. This isn't a form control, it's just there for structure.

To disable every input control inside of it, if you are using jQuery, try:

$("#<%=mypanel.ClientID%> input").attr("disabled", true);

Or plain ol' JavaScript:

var controls = document.getElementById("<%=mypanel.ClientID%>").getElementsByTagName("input");

for (var i = 0; i < controls.length; i++)
    controls[i].disabled = true;

try the following code snippet

<div>
        <asp:Panel ID="pnl" runat="server">
            <asp:TextBox runat="server" />
            <asp:TextBox runat="server" />
            <asp:CheckBox Text="text" runat="server" />
        </asp:Panel>
        <input type="button" name="name" value=" Test" onclick="ED();" />
    </div>


 <script type="text/javascript">
    function ED() {
        var div_to_disable = document.getElementById('<%=pnl.ClientID %>').getElementsByTagName("input");
        var children = div_to_disable;//.childNodes;
        for (var i = 0; i < children.length; i++) {
                children[i].disabled = true;
        };
    }
</script>

**It is Work 100% **

 function EnableDisableRadio(CheckBox1) {
            var controls = document.getElementById("<%=Panel1.ClientID%>").getElementsByTagName("input");
            for (var i = 0; i < controls.length; i++)
                controls[i].disabled = CheckBox1.checked ? false : true;
        }

 <asp:CheckBox ID="CheckBox1" runat="server" Text="check" onclick="EnableDisableRadio(this)"/>
        <asp:Panel ID="Panel1" runat="server" Width="160px" Enabled="False">
            <asp:RadioButtonList ID="RadioButtonList1" runat="server" RepeatDirection="Horizontal">
                <asp:ListItem>1</asp:ListItem>
                <asp:ListItem>2</asp:ListItem>
                <asp:ListItem>3</asp:ListItem>
            </asp:RadioButtonList>
        </asp:Panel>
    
        <br />
        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>

 <asp:CheckBox ID="CheckBox1" runat="server" Text="check" onclick="EnableDisableRadio(this)"/>
        <asp:Panel ID="Panel1" runat="server" Width="160px" Enabled="False">
            <asp:RadioButtonList ID="RadioButtonList1" runat="server" RepeatDirection="Horizontal">
                <asp:ListItem>1</asp:ListItem>
                <asp:ListItem>2</asp:ListItem>
                <asp:ListItem>3</asp:ListItem>
            </asp:RadioButtonList>
        </asp:Panel>
    
        <br />
        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>

 <asp:CheckBox ID="CheckBox1" runat="server" Text="check" onclick="EnableDisableRadio(this)"/>
        <asp:Panel ID="Panel1" runat="server" Width="160px" Enabled="False">
            <asp:RadioButtonList ID="RadioButtonList1" runat="server" RepeatDirection="Horizontal">
                <asp:ListItem>1</asp:ListItem>
                <asp:ListItem>2</asp:ListItem>
                <asp:ListItem>3</asp:ListItem>
            </asp:RadioButtonList>
        </asp:Panel>
    
        <br />
        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>

asp:panel is a server control. Why are you manipulating it at client side!? Just use mypanel.enable = false in code behind