Delete from GridView in ModalpopupExtender - asp.net

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

You need to wrap an UpdatePanel around the grid. This should solve the problem.
Another option is to use ajax.
Using Javascript/JQuery to remove the table row manually in combination with a WebMethod:
http://encosia.com/using-jquery-to-directly-call-aspnet-ajax-page-methods/
Another easy solution is to re-show the popup after post back.

Answer 2

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