Replace custom command image when it it clicked

[prayag ganoje]

Hello,

I have a raddock with custom commands. I wish to replace custom command icon with a loading gif image when that icon is clicked till the time dock get refreshed completely. Then get back to original icon.

Can you please suggest how to do that ?

[Pero]

Hi Prayag,

I suppose the RadDock is refreshed only during ajax requests, and that's why I would recommend using the PageRequestManager's endRequest client-side event. Please modify the client script in the project attached to the following forum post, as shown below: Forum Post.

<script language="javascript" type="text/javascript">
    function Click(dockId)
    {
        var dock = $find(dockId);
        var customCommand = dock.get_commands()["CustomCommand"];
        var commandElement = customCommand.get_element().firstChild;

        if (commandElement)
        {
            Sys.UI.DomElement.addCssClass(commandElement, "rdCustom1Loading");
            function EndRequest()
            {
                window.setTimeout(function ()
                {
                    if (commandElement)
                        Sys.UI.DomElement.removeCssClass(commandElement, "rdCustom1Loading");
                }, 1000);
                var requestManager = Sys.WebForms.PageRequestManager.getInstance();
                if (requestManager)
                    requestManager.remove_endRequest(EndRequest);
            }

            var requestManager = Sys.WebForms.PageRequestManager.getInstance();
            if (requestManager)
                requestManager.add_endRequest(EndRequest);
        }
    }
</script>

Best wishes,
Pero
the Telerik team