Question

首次加载页面时，我的GridView：

现在这是用户点击编辑按钮时的样子：

GridView的格式在编辑模式下看起来要好得多，所以我试图编辑它的样式，使它总是看起来像那样。我试图在rowstyle中编辑宽度和高度，但只有当它们使单元格更大时才应用这些设置，我显然希望它们更小。我无法找到或编写一种以编程方式调整单元格大小的方法。

以下是GridView及其SqlDataSource的代码（我省略了此帖子的更新参数）：

<div style="overflow:scroll; width:1500px">
            <asp:GridView id="maintenanceGridView" runat="server"
                DataSourceID="maintenanceDataSource"
                AllowSorting="true" AllowPaging="true" PageSize="50" 
                OnRowEditing="maintenanceGridView_RowEditing"
                OnRowUpdating="maintenanceGridView_RowUpdating"
                OnRowCancelingEdit="maintenanceGridView_RowCancelingEdit"
                OnRowDataBound="maintenanceGridView_RowDataBound"
                AutoGenerateEditButton="true">
                <rowstyle backcolor="LightCyan"/>
                <alternatingrowstyle backcolor="PaleTurquoise"/>
                <EmptyDataTemplate>
                    <h3>No Records Found!!</h3>
                </EmptyDataTemplate>
            </asp:GridView>
        </div>
        <asp:SqlDataSource id="maintenanceDataSource"
            DataSourceMode="DataSet"
            SelectCommand="AMT_GetMaintenanceView"
            UpdateCommand="AMT_UpdateMaintenance"
            UpdateCommandType="StoredProcedure"
            ConnectionString="<%$ ConnectionStrings:iandcInternDBConn %>"
            runat="server">
            <UpdateParameters>
            </UpdateParameters>
        </asp:SqlDataSource>
</div>

我不知道导致GridView格式发生变化的原因。我试图寻找它的默认CSS但什么都没找到，而Internet Explorer的开发人员工具告诉我，CSS在编辑模式下与在视图模式下相同。

非常感谢任何帮助或进一步的见解。谢谢！

Answer 1

在RowDataBound事件中以编程方式将单元格宽度设置为：

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
    e.Row.Cells[0].Width = Unit.Pixel(100);
    e.Row.Cells[0].HorizontalAlign = HorizontalAlign.Left;
}

Answer 2

我总是强迫GridView在第一行进入编辑模式，从而找到一个小的临时解决方法;即使用户试图取消编辑。

我是通过向Page_Load和RowDataBound事件添加代码

来实现的

protected void Page_Load(object sender, EventArgs e)
{
        // Force the gridview into edit mode always becuase its formatting looks a million times better
        GridView1.EditIndex = 0;
}

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
        // Default to edit mode
        if (GridView1.EditIndex == -1)
            GridView1.EditIndex = 0;
}

Answer 3

尝试在CSS中添加这样的内容：

.GridViewEditRow input[type=text] { /*for text boxes use td for every cell*/
        width: 50px;
    }

在编辑模式下，ASP.NET GridView格式会发生变化

3 个答案: