如何在asp:GridView中启用就地编辑？

Question

如何在提交过程中添加编辑框并读取其值asp:Repeater？

---

我有一个asp:GridView显示只读(即不可编辑)的数据集,例如:

如何启用GridView可编辑的单元格,例如(Photoshop Mockup):

注意:我没有在Photoshop中将每个行和列中的编辑框模型化(因为它花费的时间太长).你仍然明白这个想法.

• 我如何说服asp:GridView每个单元格中显示一个编辑框？
• 如果我说服asp:GridView显示一个编辑框,我如何"读取"它们OnClick的保存按钮？

奖金Chatter

我不反对使用asp:Repeater手动放置<INPUT>控件.然后我的困惑是如何在OnClick" 保存"按钮期间读取每个输入.虽然我非常乐意使用转发器,并且GridView可能无法实现我想要的转发器唯一的可能性,但这个问题是关于GridView的.

• 如果GridView 可以做到:很棒; 怎么样？
• 如果GridView 无法做到:这也是一个答案.

Answer 1

您是否尝试过设置EditIndex属性DataGrid？

例:

<asp:GridView runat="server" onrowediting="grdProducts_RowEditing" 
    ID="grdProducts">
    <Columns>
        <asp:CommandField ShowEditButton="True" />
    </Columns>
</asp:GridView>

代码背后

    protected void grdProducts_RowEditing(object sender, GridViewEditEventArgs e)
    {
        this.grdProducts.EditIndex = e.NewEditIndex;
        This.BindGrid();
    }

请注意,您必须重新绑定网格

通常您每行保存数据,这意味着每行都有一个编辑链接,进入编辑模式后,会出现一个保存按钮和一个取消按钮,可以保存该特定行的值

使用以下方法时,遵循此方法是微不足道的GridView:

    protected void grdProducts_RowUpdating(object sender, GridViewUpdateEventArgs e)
    {
        // old values for the current row
        var oldValues = e.OldValues;

        // new (updated) values for the current row
        var newvalues = e.NewValues;

        // Exit edit mode
        this.grdProducts.EditIndex = -1;

        // Update the grid
        this.BindGrid();
    }

在网格标记中添加以下内容:

    onrowupdating="grdProducts_RowUpdating"

如果需要在编辑时或以只读模式显示单元格数据时指定自定义控件,请使用网格模板:

       <Columns>
        <asp:TemplateField HeaderText="Name">
            <EditItemTemplate>
                <asp:TextBox ID="TextBox1" runat="server" Text='<%# Bind("Name") %>'></asp:TextBox>
            </EditItemTemplate>
            <ItemTemplate>
                <asp:Label ID="Label1" runat="server" Text='<%# Bind("Name") %>'></asp:Label>
            </ItemTemplate>
        </asp:TemplateField>
      </Columns>

Answer 2

您可以使用 GridView 来完成此操作，但如果您有很多列，则会生成大量代码。

首先在 GridView TemplateFields 中创建所有列。在我的示例中，我将仅使用一列。就像这样：

<asp:GridView ID="test" runat="server" AutoGenerateColumns="false">
    <Columns>
        <asp:TemplateField HeaderText="Foo" SortExpression="foo">
            <ItemTemplate>
                <asp:TextBox ID="FooText" runat="server" Text='<%# Eval("Foo") %>'></asp:TextBox>
            </ItemTemplate>
        </asp:TemplateField>
        <!-- other cols here -->
    </Columns>
</asp:GridView>
<asp:Button ID="Save" runat="server" Text="Save" OnClick="Save_Click" />

然后，在“保存”按钮后面的代码中，您可以迭代 GridView 中的行：

foreach (GridViewRow gvRow in test.Rows)
{
    string val = ((TextBox)gvRow.FindControl("FooText")).Text;
    <!-- other cols here -->
    //do something with all the values you have parsed from the row
}