Require Loading image as a progress bar

2 posts, 0 answers
  1. Bala
    Bala avatar
    5 posts
    Member since:
    Feb 2015

    Posted 09 Feb 2015 Link to this post

    Hello I am trying to show a Loading Image before loading a Report Viewer in a button click . But Its not working . Please help .

     <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="rcbSearchHierarchy">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="pnlAssetHierarchy" LoadingPanelID="Loadingpnl"></telerik:AjaxUpdatedControl>
                    </UpdatedControls>
                </telerik:AjaxSetting>
                <telerik:AjaxSetting AjaxControlID="btnViewReport">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="rptVr" LoadingPanelID="Loadingpnl"></telerik:AjaxUpdatedControl>
                    </UpdatedControls>
                </telerik:AjaxSetting>
            </AjaxSettings>
        </telerik:RadAjaxManager>

    <telerik:RadDockLayout runat="server" ID="RadDockLayout1">
                         <telerik:RadDockZone runat="server" ID="RadDockZone1" Width="99%" Skin="Vista"
                             FitDocks="false" BorderWidth="0px">
                             <telerik:RadDock runat="server" ID="RadDock1" Title="Report Criteria"
                                 DefaultCommands="ExpandCollapse" Width="100%" EnableDrag="False" Skin="Vista"
                                 DockMode="Docked" EnableRoundedCorners="false">
                                 <ContentTemplate>
                                     <telerik:RadAjaxLoadingPanel ID="Loadingpnl" runat="server" Transparency="1">
                                         <asp:Image ID="LoadingImage" runat="server" ImageUrl="~/Images/Loading.gif"></asp:Image>
                                     </telerik:RadAjaxLoadingPanel>
                                   <%--  <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                                         <ContentTemplate>--%>


                                             <table width="100%">
                                                 <tr>
                                                     <td>
                                                         <asp:Panel ID="pnlAssetHierarchy" runat="server">
                                                             <%--<ContentTemplate>--%>
                                                                 <uc1:AssetHierarchy runat="server" ID="AssetHierarchy" prmpage="4"/>
                                                             <%--</ContentTemplate>--%>
                                                         </asp:Panel>
                                                     </td>
                                                 </tr>

                                                 <tr>
                                                     <td>
                                                         <table cellpadding="0" cellspacing="0" width="100%">
                                                             <tr class="TableCont">
                                                                 <th align="left"></th>
                                                             </tr>
                                                             <tr>

                                                                 <td style="height: 24px">
                                                                     <asp:UpdatePanel ID="UpdatePanel2" runat="server">
                                                                         <ContentTemplate>
                                                                             <asp:RadioButtonList ID="rblDataRange" runat="server" onClick="DateRangeOptionSelection();"
                                                                                 RepeatDirection="Horizontal" TabIndex="8" CssClass="rbl" OnSelectedIndexChanged="rblDataRange_SelectedIndexChanged">
                                                                                 <asp:ListItem Selected="True" Value="1">YTD </asp:ListItem>
                                                                                 <asp:ListItem Value="2">Today</asp:ListItem>
                                                                                 <asp:ListItem Value="3">Date Range</asp:ListItem>

                                                                             </asp:RadioButtonList>
                                                                         </ContentTemplate>
                                                                     </asp:UpdatePanel>
                                                                 </td>
                                                             </tr>
                                                             <tr>

                                                                 <td id="tdDateRange">
                                                                     <asp:Panel ID="pnlDateRange" runat="server">
                                                                         <asp:UpdatePanel ID="UpdatePanel3" runat="server">
                                                                             <ContentTemplate>
                                                                                 <uc1:DatePicker runat="server" ID="DatePicker" />
                                                                             </ContentTemplate>
                                                                         </asp:UpdatePanel>
                                                                     </asp:Panel>
                                                             </tr>
                                                             <tr>
                                                                 <td>
                                                                     <table style="width: 90px; font-family: sans-serif; font-size: small">
                                                                         <tr>
                                                                             <td>
                                                                                 
                                                                                 <asp:Button ID="btnViewReport" runat="server" Text=" View Report " Width="85px" OnClick="btnViewReport_Click" />
                                                                             </td>
                                                                             <td></td>
                                                                             <td>
                                                                                 <telerik:RadButton ID="btnReset" runat="server" Text=" Reset " Width="85px" OnClick="btnReset_Click"></telerik:RadButton>

                                                                             </td>
                                                                         </tr>

                                                                     </table>
                                                                 </td>
                                                             </tr>
                                                         </table>
                                                     </td>
                                                 </tr>

                                             </table>
                                     <%--    </ContentTemplate>
                                     </asp:UpdatePanel>--%>
                                 </ContentTemplate>
                             </telerik:RadDock>
                         </telerik:RadDockZone>
                     </telerik:RadDockLayout>
                 </td>
             </tr>
             <tr style="height:95%">
                 <td>
                    <%-- <asp:UpdatePanel runat="server">
                         <ContentTemplate>--%>
                            
                             <rsweb:ReportViewer ID="rptVr" runat="server" Width="100%" Visible="False" ></rsweb:ReportViewer>
                        <%-- </ContentTemplate>
                     </asp:UpdatePanel>--%>
                 </td>
             </tr>
     

        </table>


      
    </asp:Content>






  2. Pavlina
    Admin
    Pavlina avatar
    6084 posts

    Posted 12 Feb 2015 Link to this post

    Hi,

    For your scenario you can manually show RadAjaxPanel on a button click event before loading a Report Viewer using its client show() method:
    http://www.telerik.com/help/aspnet-ajax/ajax-show-hide-loadingpanel.html

    Then you could hide the already shown RadAjaxLoadingPanel on the event that best fits your needs. 

    Regards,
    Pavlina
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
Back to Top