Question

I have a ModalPopupExtender which is, among other things, populated with a gridview (From a DataTable).

In this GridView I have a deletebutton attached to each row, which is supposed to delete the row. Is it anyway possible to delete the selected row from the datatable, and then update the GridView without closing the ModalPopupExtender?

Here is my 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>

And below my 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

Swap upReport panel with divPopupReport div (i.e. place upReport UpdatePanel into divPopupReport div).