RadAjax for ASP.NET

Set Loading Panel depending on AJAX initiator Send comments on this topic.
See Also
AJAX Loading Panel > AJAX Loading Panel How-To > Set Loading Panel depending on AJAX initiator

Glossary Item Box

You may set different AJAX Loading Panel for every single (ajaxified) control, which updates a control on the page.

In general this could be done using different AjaxSettings for each of ajaxified controls. See the following AJAX Manager settings, where different buttons update one and the same label control, using different loading panels:

ASPX Copy Code
      <rad:RadAjaxManager ID="RadAjaxManager1" runat="server">
           
<AjaxSettings>
               
<rad:AjaxSetting AjaxControlID="Button1">
                   
<UpdatedControls>
                       
<rad:AjaxUpdatedControl ControlID="Label1" LoadingPanelID="AjaxLoadingPanel1" />
                   
</UpdatedControls>
               
</rad:AjaxSetting>
               
<rad:AjaxSetting AjaxControlID="Button2">
                   
<UpdatedControls>
                       
<rad:AjaxUpdatedControl ControlID="Label1" LoadingPanelID="AjaxLoadingPanel2" />
                   
</UpdatedControls>
               
</rad:AjaxSetting>
           
</AjaxSettings>
       
</rad:RadAjaxManager>
There is another, more flexible approach to change the loading panel depending on the AJAX initiator. Attach the following JavaScript function to RadAjaxManager's OnRequestStart client event:
JavaScript Copy Code
    <script type="text/javascript">
            function OnRequestStart(ajaxManager, arguments)
            {
                var settings = ajaxManager.AjaxSettings;
                for (var i = 0; i < settings.length; i++)
                {
                    if (settings[i].InitControlID == arguments.EventTarget)
                    {
                        var updatedControls = settings[i].UpdatedControls;
                        for (var j = 0; j < updatedControls.length; j++)
                        {
                            var updatedControl = updatedControls[j];
                            if (arguments.EventTarget == "Button1")
                            {
                                updatedControl.PanelID = "AjaxLoadingPanel1";
                            }
                            else if (arguments.EventTarget == "Button2")
                            {
                                updatedControl.PanelID = "AjaxLoadingPanel2";
                            }

                        }
                    }
                }
            }
        </script>
Using arguments.EventTarget, the function checks the control, which made the AJAX request and sets the correspondent AjaxLoadingPanel to PanelID of the updated control.

 

See Also