从 ModalpopupExtender 中的 GridView 中删除

Question

我有一个 ModalPopupExtender，其中包含一个 gridview（来自 DataTable）。

在这个 GridView 中，我有一个附加到每一行的删除按钮，它应该删除该行。是否可以从数据表中删除选定的行，然后在不关闭 ModalPopupExtender 的情况下更新 GridView？

这是我的 GridView：

<ajaxToolkit:ModalPopupExtender ID="ModalPopupExtender1" runat="server" PopupDragHandleControlID="divPopupReport"  TargetControlID="btnHidden" PopupControlID="divPopupReport" CancelControlID="btnCloseReport" BackgroundCssClass="modalBackground"></ajaxToolkit:ModalPopupExtender>
<asp:UpdatePanel runat="server" ID="upReport">
<ContentTemplate>
<div id="divPopupReport" runat="server" style="text-align:left; padding-right:0px; background-color:White; border: 2px solid #87d000; display:none;" >

<asp:GridView ID="GridView2" runat="server" CssClass="list listExtended" 
                        DataKeyNames="DocumentGuid" Width="100%" OnRowCommand="GridView2_RowCommand" AutoGenerateColumns="false">
                        <Columns>
                            <asp:BoundField DataField="DocumentName" HeaderText="Dokumentname">
                                <ItemStyle CssClass="list"></ItemStyle>
                            </asp:BoundField>
                            <asp:BoundField DataField="CardName" HeaderText="Reference">
                                <ItemStyle CssClass="list"></ItemStyle>
                            </asp:BoundField>
                            <asp:BoundField DataField="DocumentDate" HeaderText="Date">
                                <ItemStyle CssClass="list"></ItemStyle>
                            </asp:BoundField>
                            <asp:TemplateField HeaderText="">
                                <ItemStyle CssClass="list" />
                                <ItemTemplate>
                                </ItemTemplate>
                            </asp:TemplateField>
                            <asp:TemplateField HeaderText="">
                                <ItemStyle CssClass="list" />
                                <ItemTemplate>
                                    <asp:ImageButton ID="btnDelete" CssClass="image" runat="server" CommandName="Delete" CommandArgument='<%# Eval("DocumentGuid") %>' ImageUrl="~/delete.gif" Width="16" Height="16" />
                                </ItemTemplate>
                            </asp:TemplateField>
                        </Columns>
                    </asp:GridView>
</div>    
</ContentTemplate>
</asp:UpdatePanel>

在我的 RowCommand 下方。

protected void GridView2_RowCommand(object sender, GridViewCommandEventArgs e)
{
    if (e.CommandName == "Delete")
    {
        DataTable SelectedDataTable = Session["SelectedDataTable"] as DataTable;
        string guid = Convert.ToString(e.CommandArgument);
        DataRow[] dr = SelectedDataTable.Select("DocumentGuid = '" + guid + "'");
        SelectedDataTable.Rows.Remove(dr[0]);
        Session["SelectedDataTable"] = SelectedDataTable;
        GridView2.DataSource = SelectedDataTable;
        GridView2.DataBind();
    }
}

Answer 1

您需要在网格周围包裹一个 UpdatePanel。这应该可以解决问题。

另一种选择是使用 ajax。 使用 Javascript/JQuery 结合 WebMethod 手动删除表格行： http://encosia.com/using-jquery-to-directly-call-aspnet-ajax-page-methods/

另一个简单的解决方案是在回发后重新显示弹出窗口。

Answer 2

用divPopupReport div 交换upReport 面板（即将upReportUpdatePanel 放入divPopupReport div）。