updateprogress not displaying when you click a button inside of an updatepanel?

Question

I am using jquery dialog...so I need to keep this all in an updatepanel.

Ive got the following:

 <asp:UpdatePanel ID="upNewUpdatePanel" UpdateMode="Conditional" ChildrenAsTriggers="true" runat="server">
        <ContentTemplate>
            <div id="search">
             <a href="#" onclick="return false;" class="info">Address type:<span>Select whether you want to search 'From' / 'To' type addresses.  Or select both to search all addresses.</span></a>
                <asp:RadioButtonList ID="rbSearchTypes" runat="server" 
                    RepeatDirection="Horizontal" RepeatLayout="Flow">
                    <asp:ListItem>From</asp:ListItem>
                    <asp:ListItem>To</asp:ListItem>
                    <asp:ListItem Selected="True">Both</asp:ListItem>
                </asp:RadioButtonList>
                 &nbsp;| <a href="#" onclick="return false;" class="info">Address created by:<span>Search for your addresses (addresses you have created) / search for any address in the system.</span></a>
                   <asp:RadioButtonList ID="rbSearchMyAddresses" runat="server" 
                    RepeatDirection="Horizontal" RepeatLayout="Flow">
                    <asp:ListItem Selected="True" Value="0">Anyone</asp:ListItem>
                    <asp:ListItem Value="1">Me</asp:ListItem>
                </asp:RadioButtonList>
                 <br />
                <asp:TextBox ID="txtFindSearch" runat="server" Font-Names="Arial" 
                    ToolTip="Enter a search term (ship to name / address / region, etc)."></asp:TextBox> 
                <asp:Button ID="btnFindSearch" runat="server" Text="Search" 
                    onclick="btnFindSearch_Click" BorderColor="#1367AD" BorderStyle="Solid" />
                <hr />
                <br />
                <asp:Label ID="lblRowsCount" runat="server" Text=""></asp:Label>
            </div>
            <div id="searchresults" style="">
                <asp:RadioButtonList ID="rbSearchResults" CssClass="rbsearch" runat="server" AutoPostBack="True" 
                    CellSpacing="10" RepeatColumns="4" RepeatDirection="Horizontal" 
                    ToolTip="Select an address." 
                    onselectedindexchanged="rbSearchResults_SelectedIndexChanged" Width="100%">
                </asp:RadioButtonList>
            </div>
             <div id="loading" style="width:100%;text-align:center;">
               <asp:UpdateProgress ID="UpdateProgress1" runat="server" Visible="True" DynamicLayout="True">
                        <ProgressTemplate>
                            <img style="border-style:none;" src="images/ajax-loader.gif" alt="loading" />
                        </ProgressTemplate>
               </asp:UpdateProgress>      
             </div>
        </ContentTemplate>
        </asp:UpdatePanel>

When I click btnFindSearch I was hoping while that was querying my database and pulling records my updateprogress bar UpdateProgress1 would display showing my ajax loading gif. It doesnt :(...so it gives my users the impression that my app is stuck, when really it is actually pulling the data. WIthin a few seconds the data loads the radio button list...but I was hoping my update progress would come up. Is this because I am clicking a button inside an updatepanel? Is there anything I can do to get the loading updateprogress control to come up?

Answer 1

I also having same problem what i have done with my code is ,

 <asp:UpdateProgress DynamicLayout="false" ID="UpdateProgress1" runat="server">
    <ProgressTemplate>
        <div class="Progress">
            <img alt="loading" src="images/loading1.gif" />
            &nbsp;
        </div>
    </ProgressTemplate>
</asp:UpdateProgress>

This is code for image for loading while retrieving data from server and css code for classProgress is this,

 .Progress
 {
   background-color:Transparent;
   color:White;
   width:26px;
 }

.Progress img {
   vertical-align:middle;
   margin:2px;
 }

Hope this help u,good luck!