OnClientItemSelected __doPostBack Issue

[Jon Shipman]

I'm using a FileExplorer that displays image files.  When the user selects a file I need to postback to do some logic.  So I have the following function wired up to the OnClientItemSelected event.

        function OnClientItemSelected(sender, args)
        {
            var imageSrc = args.get_path();

            if (imageSrc.match(/\.(gif|jpg|png)$/gi))
            {
                var filename = imageSrc.substring(imageSrc.lastIndexOf('/') + 1);
                __doPostBack("rfeCharts", filename);
            }
        }

After the postback, the file is no longer selected in the control.  I've tried reselecting the file on the server side with .InitialPath and on the client side using the following:

       function OnClientLoad(oExplorer, args)
        {
            var hdChartID = $get("<%=hdChartID.ClientID %>");
            var oGrid = oExplorer.get_grid();
            var dataRows = oGrid.MasterTableView.get_dataItems();

            for(var i = 0; i < dataRows.length; i++)
            {
                if(dataRows[i].get_dataItem())
                {
                    if(dataRows[i].get_dataItem().Name == hdChartID.value)
                        oGrid.MasterTableView.selectItem(oGrid.MasterTableView.get_dataItems()[i].get_element());
                }
            }
        }

And these methods both fire the OnClientItemSelected event again which causes an infinite postback loop.

So how can I persist the selected item through a postback?  Or is there another suggestion?

[Fiko]

Hello Jon,

I think that a better solution is to use AJAX approach and replace the __doPostBack method with ajaxRequestWithtarget one, which is a part of RadAjaxManager or RadAjaxpanel controls. This will allows you to refresh only the part of the page that you really need to be refreshed, without refreshing the RadFileExplorer control.

I hope this helps.

Regards,
Fiko
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[Jon Shipman]

Thanks Fiko.  I used the AJAX and ajaxRequest and ajaxRequestWithTarget as you suggested and all is working great!

I need a little more assistance.  When the user right-clicks on an item, the item is highlighted as if it selected but it does not fire the OnClientItemSelected event.  If the user clicks somewhere off the context menu, the item remains highlighted as if it's the selected item, but it is not.

So I would like to make it so that right clicking on an item fires the OnClientItemSelected event first then displays the context menu.  How do I do that?

[Fiko]

Hello Jon,

The right click does not cause the item to be selected. The node is highlighted because of the hover effect, not selection. In your case, you can attach to the TreeView's OnClientContextMenuShowing event which is fired before the menu to be shown. The code looks like this:
Cordebehind:

protected void Page_Load(object sender, EventArgs e)
{
    string[] paths = new string[] { "~/ROOT" };
    RadFileExplorer1.Configuration.ViewPaths = paths;
    RadFileExplorer1.Configuration.DeletePaths = paths;
    RadFileExplorer1.Configuration.UploadPaths = paths;

    RadFileExplorer1.TreeView.OnClientContextMenuShowing = "OnTreeContextMenuShowing";
}

The JavaScript handler:

<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
    <script type="text/javascript">
        function OnTreeContextMenuShowing(oTree, args)
        {
            alert("Openning context menu...");
            var targedNode = args.get_node();
            var oFileExplorer = $find("<%= RadFileExplorer1.ClientID %>");

            // get the RadFileExplorer's directory item associated with the node
            var fileExplorerDirectoryItem = oFileExplorer.getFileExplorerItemFromNode(targedNode);
        }
    </script>
</telerik:RadCodeBlock>

I hope this helps.

Regards,
Fiko
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[Jon Shipman]

Thanks again Fiko.  I should have been more clear.  I meant that when users right-click on an unselected item in the grid, I want the select event to fire.  In that case, it's not the hover that causes the item to become highlighted.  If the user right-clicks on an unselected item in the grid, then left-clicks somewhere other than the context menu, the context menu goes away but the item stays "selected", but the "select" event didn't fire.  For my usage, that could be potentially confusing to my users.

It appears that in the RadFileExplorer, if the user right-clicks on an unselected item, it selects the item then shows the context menu.  That's a very valid behavior for users.  But since it is selecting the item, as a developer, I would like to see it raise the OnClientItemSelected event.

For my solution, based on your example, I did the following:

Codebehind

protected void Page_Load(object sender, EventArgs e)
{
    rfeCharts.GridContextMenu.OnClientShowing = "OnGridContextMenuShowing";
}

Javascript

function OnGridContextMenuShowing(oGrid, args)
{
    var targetElement = args.get_targetElement();
    var imgPreview = $get("<%=imgPreview.ClientID %>");
    var hdChartID = $get("<%=hdChartID.ClientID %>");
    var imageDir = oGrid.get_parent().get_currentDirectory();

    hdChartID.value = targetElement.innerHTML;

    if (targetElement.innerHTML.match(/\.(gif|jpg|png)$/gi))
    {
        imgPreview.src = imageDir + "/" + targetElement.innerHTML;

        AjaxRequest("");
     }
}

In my "OnGridContextMenuShowing", I do the same things I do in my "OnClientItemSelected" event.  Is there a way to just raise the OnClientItemSelected event?  Also, is there a better way to get the file name than the targetElement.innerHTML that I'm using?

Thanks again!

PS: The forum text editor wouldn't let me remove the "italic" formatting from this bottom part.  :-)

[Fiko]

Hi Jon,

In my last reply I provided a solution which works for the node selection in the TreeView. I missed the grid selection in my previous reply. This is why, I have attached a demo to this thread which shows the steps in order to achieve the desired result when the Grid's item is right clicked. The implemented code forces the OnClientItemSelected event to be fired when a file (not a folder) on the Grid is right clicked.

The solution provides a more elegant approach in order to get the path of the grid item which is right clicked.

I hope this helps.

Kind regards,
Fiko
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.