如何调整网格视图列宽?

时间:2013-04-29 09:16:23

标签: css gridview webforms

我正在尝试使用this tutorial在我的gridview中重新调整列宽,但我无法这样做。我通过谷歌搜索已经通过了数十种方式,但没有使用它们。

正在创建问题的代码

<asp:BoundField DataField="CustomerID" HeaderText="CustomerID" HtmlEncode="False" />
<asp:BoundField DataField="Name" HeaderText="Name" HtmlEncode="False" />
<asp:BoundField DataField="Address" HeaderText="Address" HtmlEncode="False" />
<asp:TemplateField> // I don't want to show it in my gridview as it is just being
                    // for showing nested gridview
<ItemTemplate>
</td></tr>

我尝试更改列可见性,但显示/隐藏按钮不再起作用。

这就是我的gridview的样子,

enter image description here

我想要隐藏最后一个空列或最小化它的宽度,以便隐藏它并增加描述列宽度,减少ID号列宽以及第一列的宽度,

我甚至尝试过CSS方式,但之后它表示宽度为0px但宽度和ControlStyle-Width="10%"没有变化,但它没有用。

2 个答案:

答案 0 :(得分:5)

亲爱的朋友使用以下代码

    <asp:GridView runat="server" id="testGrid">
    <Columns>
        <asp:BoundField DataField="CustomerID" HeaderText="CustomerID" HtmlEncode="False" ItemStyle-Width="100px" />
        <asp:BoundField DataField="Name" HeaderText="Name" HtmlEncode="False" ItemStyle-Width="100px" />
        <asp:BoundField DataField="Address" HeaderText="Address" HtmlEncode="False" ItemStyle-Width="100px" />
    </Columns>
</asp:GridView>

或者如果你理解了css,那么使用下面的代码,你必须将css类分配给ControlStyle-CssClass属性

    <asp:GridView runat="server">
    <Columns>
        <asp:BoundField DataField="CustomerID" HeaderText="CustomerID" HtmlEncode="False" ControlStyle-CssClass="cssclass1" />
        <asp:BoundField DataField="Name" HeaderText="Name" HtmlEncode="False" ControlStyle-CssClass="cssclass2"  />
        <asp:BoundField DataField="Address" HeaderText="Address" HtmlEncode="False" ControlStyle-CssClass="cssclass3" />
    </Columns>
</asp:GridView>

答案 1 :(得分:1)

您可以为gridview列指定ItemStyle-Width属性的列重新调整大小。

 <asp:BoundField DataField="ProductID" HeaderText="ProductID" ItemStyle-Width="200px" 
 InsertVisible="False" ReadOnly="True" SortExpression="ProductID" >
 </asp:BoundField>

模板字段列对于空值可见。但是,您可以通过css禁用列边框或让列在aspx代码中呈现为这样的新表行来解决此问题

<asp:TemplateField>
            <ItemTemplate>
    <tr>
       <td colspan="100%">
            <!-- your nested control goes here-->
        </td>
    </tr>
   </ItemTemplate>
</asp:TemplateField>