Context menu shown event not triggered after drag and drop operation

[Dan Pettersson]

Hi!
I've written some code that will enable/disable buttons and context menu options based on certain conditions on the folders. I started out with the sample found here http://www.telerik.com/community/forums/aspnet-ajax/file-explorer/prevent-delete-of-top-folder.aspx but have refactored out the event hookups to javascript like this: (instead of hooking them in the aspx markup of the File Explorer control)

Sys.Application.add_load(function (sender, args) {
    $('.RadFileExplorer_Default').each(function () {
        var id = $(this).attr('id');
        var oExplorer = $find(id);

        OnClientFolderChange(oExplorer);
        oExplorer.add_folderLoaded(OnClientFolderChange);
        oExplorer.add_folderChange(OnClientFolderChange);
        oExplorer.add_itemSelected(OnClientItemSelected);

        oExplorer.get_tree().add_contextMenuShown(OnClientContextMenuShown);
    });
});

The problem I have is that after any kind of moving files and folders through drag and drop operations in the file explorer the ContextMenuShown event doesn't trigger any more so all options are available in the menu for all folders. The events for the File Explorer still works though.

Any help on this is appreciated.

[Dobromir]

Hi Dan,

This problem occurs due to the fact that the TreeView is recreated after RadFileExplorer's operation that requires a callback, i.e. copy, move, delete file or folder, refresh etc., and the client-side event handler need to be re-attached after such operations. To ensure that the handler will be always attached I would recommend you to set the OnClientContextMenuShown property of the TreeView during the Page_Load server-side event, e.g.:

protected void Page_Load(object sender, EventArgs e)
{
    RadFileExplorer1.TreeView.OnClientContextMenuShown = "OnClientContextMenuShown";
}

Regards,
Dobromir
the Telerik team

[Dan Pettersson]

Hi Dobromir,

The problem with that approach is that it isn't very unobtrusive. I would like to be able to write a general client-side script as the one I posted, that will cover any current and future FileExplorers I might add through-out the application.

Also, the asp.net ajax Sys.Application.add_load event runs for each postback that occurs in the page, including UpdatePanel postbacks.  Perhaps the general telerik javascript API has another client side event I should listen to instead for your kind of partial updates?

[Dan Pettersson]

Ok, so for now I'm setting the OnClient...-properties as you suggest with the following general code:

("FindAll" is our own FindControl extension method)

List<RadFileExplorer> fileExplorers = this.FindAll<RadFileExplorer>();
foreach (var explorer in fileExplorers)
{
    explorer.OnClientLoad = "RadFileExplorer_ClientLoad";
    explorer.OnClientItemSelected = "RadFileExplorer_ItemSelected";
    explorer.OnClientFolderLoaded = "RadFileExplorer_FolderLoaded";
    explorer.OnClientFolderChange = "RadFileExplorer_FolderChange";
    explorer.TreeView.OnClientContextMenuShown = "RadFileExplorer_TreeView_ContextMenuShown";
}

But how do I access these when the file explorer is opened through the Toolbar in the RadEditor? This code doesn't find the FileExplorer and the RadEditor doesn't expose any properties giving access to the FileExplorer...

[Dan Pettersson]

Hello again,
Can't really give up on this...

Now I've found the DialogsScriptFile property of the RadEditor control.

I've pointed this to a javascript file that include a Sys.Application.add_load... handler and verified that this runs on load and after each drag and drop operation in the file explorer. In this load event I successfully access the FileExplorer object, and subscribe to the contextmenushown event through the oExplorer.get_tree().add_contextMenuShown method. How ever, after a drag and drop operation this event is still not triggered when right clicking an item in the tree view.

[Dobromir]

Hi Dan,

You can re-attach event handlers to the RadFileExplorer's tree client-side by directly accessing the tree in the Sys.Application.add_load using $find(treesID), e.g.:

Sys.Application.add_load(function (sender, args) {
    $('.RadFileExplorer_Default').each(function () {
        var id = $(this).attr('id');
        var oExplorer = $find(id);

        OnClientFolderChange(oExplorer);
        oExplorer.add_folderLoaded(OnClientFolderChange);
        oExplorer.add_folderChange(OnClientFolderChange);
        oExplorer.add_itemSelected(OnClientItemSelected);

        $find(oExplorer.get_id()+"_tree").add_contextMenuShown(OnClientContextMenuShown);
    });
});

Best wishes,
Dobromir
the Telerik team

[Dan Pettersson]

Thank you, that works like a charm! :-)

But the fact that

oExplorer.get_tree()

doesn't work in this case should be considered a bug on your end, right?

[Dobromir]

Hi Dan,

Actually, you are correct, this can be considered as a bug in RadFileExplorer. The problem comes from the fact that the client-side RadFileExplorer's client-side property tree is re-populated in the AjaxResponseEnd event of the PageRequestManager, which is raised after the Sys.Application.Load event.

I have logged it into our database for further investigation. Here you can find the PITS Issue: Public URL.

As a small token of gratitude I have updated your Telerik points.

Kind regards,
Dobromir
the Telerik team