LoadingPanel and jquery SlideUp

3 posts, 1 answers
  1. Josh Nielson
    Josh Nielson avatar
    11 posts
    Member since:
    May 2010

    Posted 07 Dec 2011 Link to this post

    Afternoon everyone, I have a strange issue, when I use the jquery slidup function on a div that contains my 'search' fields and the grid in its own div, everything works fine except the loading panel. it creates its loading panel in side the grid as it should but when search fields div 'slides up' the rest of the html moves up as it should, except the loading panel... 

    here is some pseudo mark up to explain what i am talking about...

    <script>
      function hideSearchFields(){
           $("#searchDiv").slideUp('medium');
    }
    </script>
        <telerik:RadAjaxManager ID="radAjaxManager" runat="server">
            <%--<ClientEvents OnResponseEnd="RadAjaxManagerResponseEnd" />--%>
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="SearchLinkButton">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="ResultsRadGrid" LoadingPanelID="RadAjaxLoadingPanel1" />
                    </UpdatedControls>
            </AjaxSettings>
        </telerik:RadAjaxManager>
     </telerik:AjaxSetting>
    <div id="searchDiv">
          labels textboxes drop downs etc....
         <asp:linkbutton id="SearchLinkButton" runat="server" OnClientClick="hideSearchFields();" OnClick="search" />
    </div>
    <div>
        <telerik:radgrid id="ResultsRadGrid runat="server">
            my grid
        </telerik:radgrid>
    </div>
    <div>
      a bunch more html
    </div>
        <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Skin="Simple">
        </telerik:RadAjaxLoadingPanel>
     
    Any help would be greatly appreciated! 
  2. Answer
    Kevin
    Kevin avatar
    360 posts
    Member since:
    Jul 2012

    Posted 08 Dec 2011 Link to this post

    Hello Josh,

    That makes sense because the RadAjaxLoadingPanel is displayed using an absolute position, so it's fixed to the location it first appeared even though you hid the filters, it will not move with the grid. You can even see it happen on the demos:

    http://demos.telerik.com/aspnet-ajax/ajax/examples/loadingpanel/loadingimages/defaultcs.aspx

    If you click the button and then collapse the configurator you will see the same result.

    If you want to it work like you want I would suggest manipulating the top property of the RadAjaxLoadingPanel so it matches the slideUp animation or explictly showing the loading panel after the slideUp animation is finished and hiding it when the ajax request is completed.

    Here's a demo on how to show/hide the loading panel explicitly:

    http://demos.telerik.com/aspnet-ajax/ajax/examples/loadingpanel/explicitshowhide/defaultcs.aspx

    I hope that helps.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Josh Nielson
    Josh Nielson avatar
    11 posts
    Member since:
    May 2010

    Posted 08 Dec 2011 Link to this post

    Check, thats what I thought for now I'll use the OnResponseEnd event to handle it, and when i say handle it, I'll hide my filters on responseEnd :) but i'll work on getting the top position to match the slide up.

    Thank you for your help I really appreciate it!

Back to Top