Can I place button Target Control ID outside the Update Panel of Modal Popup in asp.net?

Question

Let me explain my problem precisely.

I have a button inside grid view. What I want to do is to show a modal popup when I click that button.

Since, I cannot place the modal popup extender inside the gridview I am placing it outside of gridview. Because I am placing it outside the gridview the gridview button has no access to it. For this I created a dummy button outside the gridview and calling the modal popup from the click event of Gridview button.

Let me show you my Grid view(Its telerik)

<telerik:RadGrid ID="GridView2" runat="server" AutoGenerateColumns="false" Width="400"
                    GridLines="None" >
            <MasterTableView >
                    <Columns>
                    <telerik:GridBoundColumn DataField="fname" HeaderText="First Name" />
                    <telerik:GridBoundColumn DataField="mname" HeaderText="Middle Name" />
                    <telerik:GridBoundColumn DataField="lname" HeaderText="Last Name" />
                    <telerik:GridTemplateColumn>
                    <ItemTemplate>
                    <asp:CheckBox ID="checkselect" runat="server" />
                    </ItemTemplate>
                    <HeaderTemplate>
                    <asp:Button ID="Button4" runat="server" Text="Remove"  CommandName="Split" OnClick="Button4_Click" />
                    </HeaderTemplate>
                    </telerik:GridTemplateColumn>
                    </Columns>
                    </MasterTableView >
             </telerik:RadGrid>
             </div>
             </td>
             </tr>
 </ItemTemplate>
 </telerik:GridTemplateColumn>
 </Columns>
 </MasterTableView>
 </telerik:RadGrid>

Now my modal popup

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Button ID="Button5" runat="server" Text="Button" style="display:none"/>
<asp:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="Button5" CancelControlID="Button1" PopupControlID="Panel1">
 </asp:ModalPopupExtender>
   <asp:Panel ID="Panel1" runat="server" Height="65px" style="display:none" >
    <p>
    Thank You for Removing records
    </p>
    </asp:TextBox> <asp:Button ID="Button3" runat="server" Text="Submit"  />
    <asp:Button ID="Button1" runat="server" Text="Cancel" />
     </asp:Panel>
  </ContentTemplate>
  </asp:UpdatePanel>

The problem is when I am clicking the gridview button( Button4) it is throwing me Invalid Postback error. I think thats because I am placing the Modalpopup inside update panel and gridview outside. Can someone tell me how to deal with this issue? I cannot place the Gridview inside the update panel because it is stopping the button click event which is causing the modal popup extender to show.

Button Click Event:

 protected void Button4_Click(object sender, EventArgs e)
    {
    ModalPopupExtender1.Show();
    }

Answer 1

Update: here is how you display confirmation message and collect user input when a button is clicked.

Then collect the selected checkbox Id from the code behind.

Note that you need to assign PrimaryKey/UniqueKey to DataKeyName of RadGrid.

<asp:ScriptManager runat="server" ID="ScriptManager"></asp:ScriptManager>
<telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="false" 
    Width="400" GridLines="None" OnNeedDataSource="RadGrid1_NeedDataSource">
    <MasterTableView DataKeyNames="Id">
        <Columns>
          <telerik:GridBoundColumn DataField="FirstName" HeaderText="First Name" />
          <telerik:GridBoundColumn DataField="MiddelName" HeaderText="Middle Name" />
          <telerik:GridBoundColumn DataField="LastName" HeaderText="Last Name" />
          <telerik:GridTemplateColumn>
                <ItemTemplate>
                    <asp:CheckBox ID="SelectCheckBox" runat="server" />
                </ItemTemplate>
                <HeaderTemplate>
                    <asp:Button ID="Button4" runat="server" Text="Remove"
                        OnClientClick="return showWindow();" />
                </HeaderTemplate>
            </telerik:GridTemplateColumn>
        </Columns>
    </MasterTableView>
</telerik:RadGrid>
<telerik:RadWindow ID="RadWindow1" runat="server" Width="400" Height="200">
    <ContentTemplate>
        Enter a reason to delete:<br />
        <asp:TextBox runat="server" ID="ReasonTextBox" TextMode="MultiLine" Rows="5" 
            Width="350" /><br />
        <asp:Button runat="server" ID="DeleteButton" Text="Delete" 
            OnClick="DeleteButton_Click" />
    </ContentTemplate>
</telerik:RadWindow>
<script type="text/javascript">
    function showWindow() {
        var wnd = $find("<%=RadWindow1.ClientID %>");
        wnd.show();
        return false;
    }
</script>

public class User
{
    public int Id { get; set; }
    public string FirstName { get; set; }
    public string MiddelName { get; set; }
    public string LastName { get; set; }
}

protected void RadGrid1_NeedDataSource(object sender, GridNeedDataSourceEventArgs e)
{
    RadGrid1.DataSource = new List<User>()
    {
        new User {Id = 1, FirstName = "Jon", LastName = "Doe"},
        new User {Id = 2, FirstName = "Eric", LastName = "Newton"},
        new User {Id = 3, FirstName = "One", LastName = "Two"},
    };
}

protected void DeleteButton_Click(object sender, EventArgs e)
{
    var ids = new List<int>();
    foreach (GridDataItem item in RadGrid1.Items)
    {
        var selectCheckBox = item.FindControl("SelectCheckBox") as CheckBox;
        if (selectCheckBox.Checked)
        {
            int id = Convert.ToInt32(item.GetDataKeyValue("Id"));
            ids.Add(id);
        }
    }
}

Answer 2

If a button is clicked inside a GridView, it raises an event called 'RowCommand'. You can specify what method this uses through the markup:

<telerik:RadGrid ..attributes.. OnRowCommand="DoThisMethod">

Then in the code behind:

protected void DoThisMethod(object sender, EventArgs e)
{
    //Do your stuff
}

This means you can now put the GridView into the panel as it should still raise the row command event regardless.

I'm not sure about RadGrid, but this is certainly the case for GridViews