使用Javascript启用/禁用<asp:Panel>及其所有控件

Question

我在页面上有一个asp:panel，在运行时，我向该面板添加控件，并根据业务逻辑禁用/启用它的所有控件。

我尝试了以下方法：

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

但是它没有起作用。

有人有什么想法可以让它工作吗？

- BreakHead

---

你会/可以使用jQuery框架吗？ - The Scrum Meister

请注意，如果您禁用表单元素，则在提交数据时它们的值不会发送到服务器。如果您希望发送该值，请改为分配其readOnly属性。 - Shadow The Spring Wizard

Answer 1

asp:Panel 只是生成一个 div 元素。它不是表单控件，只是用于结构。

如果你正在使用 jQuery，要禁用其中的每个输入控件，请尝试：

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

或者使用普通的JavaScript：

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

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

- zdyn

---

正确的方法，但是ASP.NET会生成“动态”ID，所以要使用以下代码来获取它：document.getElementById("<%=mypanel.ClientID%>")。 - Shadow The Spring Wizard

Answer 2

请尝试以下代码片段

<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>

- santosh singh

---

不好，它无法迭代足够深 - 如果面板包含另一个包含文本框的面板怎么办？getElementsByTagName非常适合这种情况。 - Shadow The Spring Wizard

没有问题，不过我必须评论一下，ZDYN的答案与您得到的ID除外完全相同。 - Shadow The Spring Wizard

Answer 3

**它百分之百有效**

 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>

- Suraj

Answer 4

 <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>

- Suraj

---

您能否详细阐述一下您的答案，并对您提供的解决方案进行更多描述？ - abarisone

Answer 5

asp:panel是一个服务器控件。为什么要在客户端操作它呢？只需在代码后台使用mypanel.enable = false即可。

- Null Head