Resize an asp.net panel width based on a checkboxlist?_问答_开发者

Resize an asp.net panel width based on a checkboxlist?

开发者 https://www.devze.com 2022-12-29 13:08 出处：网络

I have an asp.net panel that contains a checkboxlist.I\'d like to resize it so that its width fits the list\'s contents snugly.

I have an asp.net panel that contains a checkboxlist. I'd like to resize it so that its width fits the list's contents snugly.

Right now I'm handling the panel's pre rendering event, setting its width to match that of the checkboxlist. However it appears the checkboxlist's width property reads zero (at least in this pre render method) so the panel's width is set identically, w开发者_运维百科hich leads to inconsistent renderings in Firefox vs IE. Does anyone have a better approach to doing what I'm attempting here? Many thanks.

You could set the panel width onload per javascript:

<script>
function resizePanel() {
            var panel = document.getElementById('Panel1');
            var checkBox = document.getElementById('CheckBoxList1')
            if (panel != null && checkBox != null)
                panel.style.width = checkBox.offsetWidth + "px";
}
</script>
</head>
<body onload="resizePanel()">
    <form id="form1" runat="server">
    <asp:Panel ID="Panel1" runat="server" BorderWidth="1" BorderColor="Silver">
    <asp:CheckBoxList ID="CheckBoxList1" Width="200px" runat="server">
    <asp:ListItem Text="Item 1" Value="1"></asp:ListItem>
    <asp:ListItem Text="Item 2" Value="2"></asp:ListItem>
    <asp:ListItem Text="Item 3" Value="3"></asp:ListItem>
    <asp:ListItem Text="Item 4" Value="4"></asp:ListItem>
    <asp:ListItem Text="Item 5" Value="5"></asp:ListItem>
    <asp:ListItem Text="Item 6" Value="6"></asp:ListItem>
    <asp:ListItem Text="Item 7" Value="7"></asp:ListItem>
    </asp:CheckBoxList>
    </asp:Panel>
    </form>
</body>
</html>