Question

在下面的示例中，我使用一些数据填充gridview。一切都很好，但我不知道如何设置列宽。 gridview没有任何设置列，因此我无法使用ItemStyle-Width。我尝试使用GridViewClicks_RowDataBound，但即使e.Row.Cells[i].Width有效，e.Row.Cells[i].Height也无效。

我也尝试在column.ItemStyle.Width中设置page_load，但也无效。

基本上，我需要设置gridview的列宽而不在标记中添加列。

感谢任何帮助。

感谢。

这是标记：

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">
        .GridDock
        {
            overflow-x: auto;
            width:  calc(100% - 480px);
            padding: 0 0 17px 0;
        }
    </style>
    <script type="text/javascript">

        $('#dvGridWidth').width($('#dvScreenWidth').width());

    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <div style="width: 300px; height: 300px; display:inline-block; vertical-align:top">
            <asp:Button ID="Button1" runat="server" Width="278px" Text="Button" />
        </div>
        <div style="width: 160px; height: 160px; display:inline-block;vertical-align:top">
            <asp:Button ID="Button2" runat="server" Width="140px" Text="Button" />
        </div>
        <div style="display:inline-block;" class="GridDock" id="dvGridWidth">
            <asp:GridView ID="GridView1" runat="server" OnRowDataBound="GridViewClicks_RowDataBound">
            </asp:GridView>
        </div>
    </div>
    </form>
</body>
</html>

代码隐藏：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;

namespace ToErase
{
    public partial class Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            DataTable gridDataDataTable = new DataTable();
            gridDataDataTable.Columns.Add("ID");
            gridDataDataTable.Columns.Add("Name");
            gridDataDataTable.Columns.Add("Address1");
            gridDataDataTable.Columns.Add("Address2");
            gridDataDataTable.Columns.Add("Address3");
            gridDataDataTable.Columns.Add("City");
            gridDataDataTable.Columns.Add("Zip");
            gridDataDataTable.Columns.Add("Province");
            gridDataDataTable.Columns.Add("Country");
            gridDataDataTable.Columns.Add("Sex");
            gridDataDataTable.Columns.Add("SNo");
            gridDataDataTable.Columns.Add("TelNo");
            gridDataDataTable.Columns.Add("FaxNo");
            gridDataDataTable.Columns.Add("MobileNo");
            gridDataDataTable.Columns.Add("VehicleNo");
            gridDataDataTable.Columns.Add("Color");
            gridDataDataTable.Columns.Add("Height");
            gridDataDataTable.Columns.Add("Weight");
            gridDataDataTable.Columns.Add("Company");
            gridDataDataTable.Columns.Add("CompanyAddress");
            gridDataDataTable.Columns.Add("CompanyTelNo");
            gridDataDataTable.Columns.Add("CompanyFaxNo");

            gridDataDataTable.Rows.Add("1", "Ryan", "City Stree1", "City Stree2", "City Stree1", "Barcelona", "232232", "N/A", "Spain", "Male", "S23343", "2223-232323-22", "2223-232323-22", "2223-232323-22", "2223-232323-22", "Red", "80cm", "75kg", "Lockheed Martin", "City Street3", "800-536145", "800-142587");
            gridDataDataTable.Rows.Add("2", "Ryan", "City Stree1", "City Stree2", "City Stree1", "Barcelona", "232232", "N/A", "Spain", "Male", "S23343", "2223-232323-22", "2223-232323-22", "2223-232323-22", "2223-232323-22", "Red", "80cm", "75kg", "Lockheed Martin", "City Street3", "800-536145", "800-142587");
            gridDataDataTable.Rows.Add("3", "Ryan", "City Stree1", "City Stree2", "City Stree1", "Barcelona", "232232", "N/A", "Spain", "Male", "S23343", "2223-232323-22", "2223-232323-22", "2223-232323-22", "2223-232323-22", "Red", "80cm", "75kg", "Lockheed Martin", "City Street3", "800-536145", "800-142587");

            GridView1.DataSource = gridDataDataTable;
            GridView1.DataBind();    
            /* The following code does not affect grid columns */                  
            foreach (DataControlField column in GridView1.Columns)
            {
                column.ItemStyle.Width = Unit.Pixel(400);
            }

        }
        protected void GridViewClicks_RowDataBound(object sender, GridViewRowEventArgs e)
        {
            if (e.Row.RowType == DataControlRowType.DataRow)
            {
                DataRowView drv = e.Row.DataItem as DataRowView;

                for (int i = 0; i < drv.Row.ItemArray.Length; i++)
                {
                    e.Row.Cells[i].Width = 200;  // The width is not being set to 200px
                    e.Row.Cells[i].Height = 200; // This works, I can set the height
                }
            }
        }
    }
}

Answer 1

您可以向网格视图添加Css类（属性），浏览器中的网格视图将呈现为您可以根据需要设计/指定表格的表格。

添加一个css样式说：

table{
    border: 1px solid black;
    table-layout: fixed;
    width: 200px;
}

th, td {
    border: 1px solid black;
    width: 100px;
}

@Runtime使用GridView的RowDataBound事件更改宽度： EX：

protected void DataGrid_RowDataBound(object sender, GridViewRowEventArgs e)
{
     e.Row.Cells[0].Width = new Unit("width-in-px");
     e.Row.Cells[1].Width = new Unit("width-in-px");
     ......
}

您还可以计算gridview列并循环上面的宽度相同

设置gridview列宽？

1 个答案: