如何修改ListView控件中該列的面積/大小？

Question

我是一名新的ASP.NET開發人員，我面臨着ListView樣式的問題。風格運作良好，但現在我不能從右側看到最後一欄，我不知道爲什麼如本快照：

這裏是我的原代碼：

<asp:ListView ID="All_ListView" runat="server" DataKeyNames="ID" DataSourceID="SqlDataSource1"> 
         <LayoutTemplate> 
          <div ><table id="thetable" cellpadding="4px" cellspacing="1px" style="margin:0px 0px 0px 0px; border:2px solid #003366; font-size:13px; font-weight:bold;"> 
           <thead> 
            <tr style="background-color:#C6D7B5;"> 
             <%--<th style="border-right:2px solid white;border-bottom:2px solid #003366; ">LL No.</th>--%> 
             <th style="border-bottom:2px solid #003366; "> 
              <asp:CheckBox ID="CheckBox1" runat="server" CssClass="chkBoxPosition" OnCheckedChanged="CheckBoxHeader_All" AutoPostBack="true" /> 
             </th>  
             <th style="border-bottom:2px solid #003366; ">Title</th> 
             <th style="border-bottom:2px solid #003366; ">Description</th> 
             <th style="border-bottom:2px solid #003366; ">Type</th> 
             <th style="border-bottom:2px solid #003366; ">Username</th> 
             <th style="border-bottom:2px solid #003366; ">Name</th> 
             <th style="border-bottom:2px solid #003366; ">Division</th> 
             <th style="border-bottom:2px solid #003366; ">Submitted Date</th> 
             <th style="border-bottom:2px solid #003366; ">Status</th> 
            </tr> 
           </thead> 
           <tbody><tr id="itemPlaceholder" runat="server"></tr></tbody> 
          </table></div> 
         </LayoutTemplate> 
         <ItemTemplate> 
          <tr> 
           <td> 
            <asp:CheckBox ID="CheckBox2" runat="server" /> 
            </td> 
           <td> 
            <asp:Label runat="server" ID="lblTitle" Text='<%#Eval("Title") %>'></asp:Label> 
            </td> 
           <td> 
            <asp:Label runat="server" ID="lblDescription" Text='<%#Eval("Description")%>'></asp:Label> 
           </td> 
           <td> 
            <asp:Label runat="server" ID="lblType" Text='<%#Eval("Type")%>'></asp:Label> 
           </td> 
           <td> 
            <asp:Label runat="server" ID="lblUsername" Text='<%#Eval("Username") %>'></asp:Label> 
           </td> 
           <td> 
            <asp:Label runat="server" ID="lblName" Text='<%#Eval("Name") %>'></asp:Label> 
           </td> 
           <td> 
            <asp:Label runat="server" ID="lblDivision" Text='<%#Eval("DivisionShortcut") %>'></asp:Label> 
           </td> 
           <td> 
            <asp:Label runat="server" ID="lblSubmittedDate" Text='<%#Eval("DateSubmitted")%>'></asp:Label> 
           </td> 
           <td> 
            <asp:LinkButton runat="server" ID="lnkSuggestionStatus" Text='<%#Eval("Status")%>' 
                  OnClick="lnkSuggestionStatus_Click"> 
            </asp:LinkButton> 
           </td> 
          </tr> 
         </ItemTemplate>     
       </asp:ListView> 

我改第二列的寬度是最需要的列表視圖的面積和看看發生了什麼，當我改變了它

<asp:ListView ID="All_ListView" runat="server" DataKeyNames="ID" DataSourceID="SqlDataSource1"> 
         <LayoutTemplate> 
          <div ><table id="thetable" cellpadding="4px" cellspacing="1px" style="margin:0px 0px 0px 0px; border:2px solid #003366; font-size:13px; font-weight:bold;"> 
           <thead> 
            <tr style="background-color:#C6D7B5;"> 
             <%--<th style="border-right:2px solid white;border-bottom:2px solid #003366; ">LL No.</th>--%> 
             <th style="border-bottom:2px solid #003366; "> 
              <asp:CheckBox ID="CheckBox1" runat="server" CssClass="chkBoxPosition" OnCheckedChanged="CheckBoxHeader_All" AutoPostBack="true" /> 
             </th>  
             <th style="border-bottom:2px solid #003366; ">Title</th> 
             <th style="border-bottom:2px solid #003366; ">Description</th> 
             <th style="border-bottom:2px solid #003366; ">Type</th> 
             <th style="border-bottom:2px solid #003366; ">Username</th> 
             <th style="border-bottom:2px solid #003366; ">Name</th> 
             <th style="border-bottom:2px solid #003366; ">Division</th> 
             <th style="border-bottom:2px solid #003366; ">Submitted Date</th> 
             <th style="border-bottom:2px solid #003366; ">Status</th> 
            </tr> 
           </thead> 
           <tbody><tr id="itemPlaceholder" runat="server"></tr></tbody> 
          </table></div> 
         </LayoutTemplate> 
         <ItemTemplate> 
          <tr> 
           <td> 
            <asp:CheckBox ID="CheckBox2" runat="server" /> 
            </td> 
           <td> 
            <asp:Label runat="server" ID="lblTitle" Text='<%#Eval("Title") %>'></asp:Label> 
            </td> 
           <td> 
            <asp:Label runat="server" ID="lblDescription" Text='<%#Eval("Description")%>' Width="50%"></asp:Label> 
           </td> 
           <td> 
            <asp:Label runat="server" ID="lblType" Text='<%#Eval("Type")%>'></asp:Label> 
           </td> 
           <td> 
            <asp:Label runat="server" ID="lblUsername" Text='<%#Eval("Username") %>'></asp:Label> 
           </td> 
           <td> 
            <asp:Label runat="server" ID="lblName" Text='<%#Eval("Name") %>'></asp:Label> 
           </td> 
           <td> 
            <asp:Label runat="server" ID="lblDivision" Text='<%#Eval("DivisionShortcut") %>'></asp:Label> 
           </td> 
           <td> 
            <asp:Label runat="server" ID="lblSubmittedDate" Text='<%#Eval("DateSubmitted")%>'></asp:Label> 
           </td> 
           <td> 
            <asp:LinkButton runat="server" ID="lnkSuggestionStatus" Text='<%#Eval("Status")%>' 
                  OnClick="lnkSuggestionStatus_Click"> 
            </asp:LinkButton> 
           </td> 
          </tr> 
         </ItemTemplate>     
       </asp:ListView> 

你能幫我解決這個顯示問題嗎？

Answer 1

嗨，你可以試試這個。

int height = listView1.Items[0].Bounds.Height + listView1.Items[listView1.Items.Count - 1].Bounds.Bottom; 

listView1.Size = new Size(400, height); 

Answer 2

我懷疑你的列表視圖是一個div，面板或具有固定寬度的一些其他家長控制，如600像素內，因爲你已經改變了第二列的寬度，另一列沒有足夠的空間來顯示，我猜沒有在div上設置溢出。

你有兩個選擇：

1. 從這個家長控制刪除您的ListView這樣可以動態調整大小根據需要
2. 的DIV創建CSS樣式規則顯示滾動條，如果內容溢出超出固定寬度：

CSS：

#listViewParent 
{ 
    width:600px; 
    float:left; 
    overflow:auto; 
} 

ASPX：

<div id="listViewParent"> 
    Your ListView goes here 
</div>