How to exclude control nested within an Ajaxified container (panel or placeholder) from triggering loading panel?

[jgill]

I am having a difficult time (it's been two days already) trying to prevent the display of a loading panel when a nested control triggers an async/ajax event.

In my situation I have an ASP:Panel that is Ajaxified via adding a declarative AjaxSetting on a page and the loading panel is specified.  This is because normally I want the loading panel to display for anything that updates in the panel, like the markup below:

<telerik:AjaxSetting AjaxControlID="ProblematicArea">
                   <UpdatedControls>
                       <telerik:AjaxUpdatedControl ControlID="ProblematicArea" LoadingPanelID="LoadingPanel" />
                   </UpdatedControls>
</telerik:AjaxSetting>

This is what the panel looks like when defined.

<asp:Panel ID="ProblematicArea" runat="server" >
     <asp:PlaceHolder Runat="server" ID="DynamicControls"></asp:PlaceHolder>
</asp:Panel>

I am adding dynamic controls, user controls, when the page loads to the "DynamicControls" placeholder.  Normally when one of these dynamically added user controls has a drop down or another control, this works great because if I auto-postback the dropdown it gets included in the events that trigger that loading panel.

However, I have a situation where there is a particular button in a particular user control that I do not want it to trigger the appearance of the loading panel when a user clicks the button, because the button has JavaScript to trigger another screen/UI blocking function while a server-side process is running instead of the loading panel (which does not block all controls on the screen normally).  The situation as it stands is that both the ajax loading panel and this other screen/ui blocking (the second one blocks the entire screen and has a different look and feel) load and it's very confusing to the user/redundant.

It is not that I want to remove the AjaxUpdateControl entry for the "ProblematicArea" it's that I do not want the loading panel to display in a particular case and for all other cases I want it to display.

[Iana Tsolova]

Hello Jgill,

You have two options for achieving your goal:
- Remove the setting for the loading panel ID from the ajax settings and show the loading panel manually only in the cases it is necessary.
- Handle the OnClientShowing client-side event of the loading panel and cancel its display in case the custom UI is about to be displayed.

Give it a try and let me know if this helps.

Kind regards,
Iana Tsolova
the Telerik team

[jgill]

Hello Iana,
I am using a version of the RadLoadingPanel from 2009.3 1314 (Jan 14, 2010).  The OnClientShowing clientside methods of the RadLoadingPanel seems unavailable to me.

[jgill]

I had to do some trickery.  The loading panel's .hide() or .hide(elementThatLoadingPanelIsOver) did not work for this, it still kept displaying both loading panels, however this ended up working.  If just choose which version of the OnRequestStart method to load as the clientside script from the serverside while the page is rendering.

function OnRequestStart(sender, args)
{
     if (args.EventTargetElement != null)
     {
          loadingPanel = $find('LoadingPanel100200');
          if (loadingPanel != null)
          {
               loadingPanel.set_visible(false);
          }
     }
}