javascript - 自动调整具有溢出按钮动态集合的 ASP.NET 面板

Question

基本上，在客户端控件内，我调用查询以从表中获取一些数据，并根据输出创建按钮并将它们从代码隐藏添加到 ASP:Panel

这些按钮有一个 CSS，可以一个接一个地向左移动，而不是将它们显示为彼此下方的一个 block 。

CSS

.button_red2 
{   background:url('../../images/button_red_left.gif') no-repeat left top;  display:block;  font-size:12px;     font-weight:bold;   line-height:16px;   height:21px;    padding-left:9px; 
    padding-top:0px;  margin-bottom :2px;   text-decoration:none;   border-style:none;  color:White; width:auto;    overflow:visible ;   float:left;}
.button_red2  span
{   background:transparent url('../../images/button_red.gif') no-repeat top right; 
    padding:3px 10px 2px 0px;   border-style:none;  display:block ;}

在代码隐藏中

                Dim locationdt = sqlDMLhelper.ExecuteQueryDT(String.Format("select distinct City from {2}{1}{2} where Staff_FK='{0}' order by City ASC", staffID, "EUS-Customer", ControlChars.Quote), cerr)

                If Not locationdt.Rows.Count = 0 Then
                    For i = 0 To locationdt.Rows.Count - 1
                        Dim Sitename = locationdt.Rows(i).Item(0)

                        Dim thebutton = New LiteralControl(" <button ID='Button'" & i & " runat='server' class='button_red2' onclick='ClickedSite(""" & Sitename & """);' type='button'> <span> " & Sitename & "</span> </button> ")
                        DrilldownPanel.Controls.Add(thebutton)
                    Next
                    
                End If

在 aspx 中

<h1> Drill Down Per Site </h1>
<div style="display:block; padding-top: 5px; " ></div>
  <asp:Panel ID="DrilldownPanel" runat="server" Height="21" > 
</asp:Panel>

我可以安全地指定高度 21，因为我将始终至少有一个按钮。

容器本身设置为 600 像素宽度。

我想知道是否有办法动态设置“DrilDownPanel”的高度值

1. 我不知道我会有多少个地点(至少 1 个)，
2. 位置的名称将有多长以及它们从什么时候开始溢出到下一行。

有哪些工具可用于遍历该面板的集合项以查看如何我有很多“线”，因此在渲染开始之前动态调整高度。

还是不可能？

Answer 1

如果您将面板高度设置为“自动”，它应该根据内容进行调整。