Update Progress GIF Image Can't be displayed when i click on a button in Modal pop Extender

Question

I have an issue that I can't display my update progress GIF image when I click button in Modal Pop Extender

the Aspx Code is :

<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
    <ProgressTemplate>
        <img src="ajax-loader.gif"  />
    </ProgressTemplate>
</asp:UpdateProgress>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate>
        <asp:Button ID="Button2" runat="server" Text="Button" />
        <asp:Panel ID="Panel1" runat="server">
            <asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />
        </asp:Panel>
        <asp:ModalPopupExtender PopupControlID="Panel1" TargetControlID="Button2" ID="mpeConfirm"
            runat="server">
        </asp:ModalPopupExtender>
    </ContentTemplate>
</asp:UpdatePanel>

and in the code behind I wrote that simple code to be able to display the Progress :( :

protected void Button1_Click(object sender, EventArgs e)
{
    Thread.Sleep(2000);
}

Answer 1

After 1 day of googling. I made it :) .The solution was easy and really marvelous .

First, I made a simple modification in the designer. I just moved the update panel inside Modalpop Extender panel control like the following:

<asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <asp:UpdateProgress ID="UpdateProgress1" runat="server">
        <ProgressTemplate>
            <img src="ajax-loader.gif" />
        </ProgressTemplate>
    </asp:UpdateProgress>
    <asp:Button ID="Button2" runat="server" Text="Button" />
    <asp:Panel ID="Panel1" runat="server">
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
                <asp:Button ID="Button1" runat="server" Text="panel" OnClick="Button1_Click" />
            </ContentTemplate>
        </asp:UpdatePanel>
    </asp:Panel>
    <asp:ModalPopupExtender ID="modalExtender" runat="server" PopupControlID="Panel1"
        TargetControlID="Button2">
    </asp:ModalPopupExtender>

On the other hand, I added that code block on the Modal Pop Extender Button:

protected void Button1_Click(object sender, EventArgs e)
{
    string script ="document.getElementById(";
    script += "'";
    script+=Panel1.ClientID;
    script += "'";
    script+=").style.display='none';";
    ScriptManager.RegisterStartupScript(this, this.GetType(), "A",script , true);
    System.Threading.Thread.Sleep(2000);

}

Many thanks to "Hitesh Sharma" and his reply to a similar issue through that useful link : http://forums.asp.net/t/1552551.aspx