Setting selected items in the File Explorer

[TBI]

I'm trying to figure out how to set selected items in the File Explorer.  At page load, I'd like to iterate through the items in the file explorer and be able to select one or more items.

Does the FileExplorer currently have built-in functionality to support this?  or any work arounds that'll allow me to select items?

Thanks!

[Fiko]

Hello TBI,

For the time being the RadFileExplorer control does not provides the ability to select multiple files on initial load. This behavior, however, can be easily achieved by using the approach implemented in the attached project. For your convenience I added multiple comments in the code.

I hope this helps.

Sincerely yours,
Fiko
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[TBI]

Hi Fiko,

Thanks for the posting the sample app.  I ran the app, it loads the fileexplorer but doesn't trigger the OnExplorerLoad function.  I set breakpoints at beginning of both javascript functions and simplified the example by taking out the extra controls (combobox, button) and still no go.  

Also tried the code on a fileexplorer in my app to see if I can get the javascript functions to fire but no go.  Any ideas?

Thanks!

[Fiko]

Hello TBI,

In such case it will be best to open a new support thread and send us the whole project including the DLL files. We will debug it and do our best to provide a solution as soon as possible.


Kind regards,
Fiko
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[Fred]

was this code ever corrected? It may be what I need.

[Dobromir]

Hi Fred,

I tested the sample page provided by Fiko and it was working as expected.

The code responsible for multiple file selected is the following:
ASPX:

<script type="text/javascript">
    var selectedFileName = null;
    function OnExplorerLoad(oFileExplorer, args)
    {
        if (selectedFileName)
            selectSpecificFile(oFileExplorer.get_grid()); // Select the files ;
    }
    function selectSpecificFile(oGrid)
    {
        // Splt the file names ;
        var arrOfFileNames = selectedFileName.split(/\;/);

        // Remove the space characters from the start and end of the strings ;
        for (var i = 0; i < arrOfFileNames.length; i++)
        {
            arrOfFileNames[i] = arrOfFileNames[i].trim();
        }

        var dataRows = oGrid.MasterTableView.get_dataItems();
        for (var i = 0; i < dataRows.length; i++)
        {
            if (dataRows[i].get_dataItem())
            {
                // Check whether the current file name that is showed in the grid is contained in the 'arrOfFileNames' array;
                if (Array.contains(arrOfFileNames, dataRows[i].get_dataItem().Name))
                {// yes, the file needs to be selected
                    oGrid.MasterTableView.selectItem(oGrid.MasterTableView.get_dataItems()[i].get_element());
                }
            }
        }
    }
</script>

Code-Behind:

private void SelectinitialPath(string fileNames)
{
    // Assign a value to the 'selectedFileName' JavaScript variable;
    string script = " selectedFileName = '" + fileNames + "';";
    ScriptManager.RegisterStartupScript(this, this.GetType(), "SelectedFileName", script, true);
}

Please note that the selectedFileName variable should contain names of files to be selected separated with ; (semicolon), and these files should be present in the initially loaded folder.

Kind regards,
Dobromir
the Telerik team

[Fred]

after using this successfully for a while we just found out the sorting unselects and selects whats ever on top. Any ideas what to do?

[Dobromir]

Hi Fred,

RadFileExplorer is using RadGrid to provide the grid view and RadGrid does not preserve its selection after sort command. Nevertheless, you can manually store the selection and reselect items again using the approach from the following help article:
Persisting the Selected Rows Client-side on Sorting/Paging/Filtering/Grouping

Kind regards,
Dobromir
the Telerik team

[Shawn]

So...I think I followed what to do from the selectfilesonexplorer.zip that was referenced by Fiko.  In the Javascript code OnExplorerLoad I successfully go into the if statement because I did set the selectedFileName (see javascript code below and then my continued question after that):

    <script type="text/javascript">
        var selectedFileName = null
        function OnExplorerLoad(oFileExplorer, args)
        {
            if (selectedFileName)
                selectSpecificFile(oFileExplorer.get_grid()); // Select the files ;
        }
        function selectSpecificFile(oGrid)
        {
            // Splt the file names ;
            var arrOfFileNames = selectedFileName.split(/\;/);

            // Remove the space characters from the start and end of the strings ;
            for (var i = 0; i < arrOfFileNames.length; i++)
            {
                arrOfFileNames[i] = arrOfFileNames[i].trim();
            }

            var dataRows = oGrid.MasterTableView.get_dataItems();
            for (var i = 0; i < dataRows.length; i++)
            {
                if (dataRows[i].get_dataItem())
                {
                    // Check whether the current file name that is showed in the grid is contained in the 'arrOfFileNames' array;
                    if (Array.contains(arrOfFileNames, dataRows[i].get_dataItem().Name))
                    {// yes, the file needs to be selected
                        oGrid.MasterTableView.selectItem(oGrid.MasterTableView.get_dataItems()[i].get_element());
                    }
                }
            }
        }

    </script>

My oFileExplorer.get_grid() that gets passed to selectSpecificFile is null.  I can't figure out why.  As a result I'm never able to have the selected files already selected in my RadFileExplorer.

Any ideas on what the issue is?  I'm using Telerik.Web.UI version 2012.3.1017.0.

Thanks,

Shawn

[Vessy]

Hi Shawn,

Following-up the conversation in a primary suppor ticket on the subject, it turn out that the experienced issue is caused by the fact you are using FileExplorer in a Thumbnails mode, where a RadGrid object is not created.

For convenience and a further reference for other users experiencing a similar porblem, I am pasting my answer here, providing a solution for a Thumbnails scenario.

When the FileExplorer is used in thumbnails the control used to list the files in the right pane is a ListView, but not a Grid. This is why you cannot get a reference to the non existing grid client object.

In order to have the desired selecting functionality working for Thumbnails mode, you can use a similar implementation:

<script type="text/javascript">
    var selectedFileName = null;
    function OnExplorerLoad(oFileExplorer, args) {
        if (selectedFileName)
            selectSpecificFile(oFileExplorer.get_fileList()); // Select the files ;
    }
    function selectSpecificFile(fileList) {
        var arrOfFileNames = selectedFileName.split(/\;/);

        // Remove the space characters from the start and end of the strings ;
        for (var i = 0; i < arrOfFileNames.length; i++) {
            arrOfFileNames[i] = arrOfFileNames[i].trim();
        }

        var dataItems = fileList.get_items();

        for (var i = 0; i < dataItems.length; i++) {

            if (Array.contains(arrOfFileNames, dataItems[i].Name)) {
                fileList.selectFile(dataItems[i]);
            }
        }
    }
</script>

Hope this helps.

Kind regards,
Vessy
Telerik

 

 

[Shawn]

Vessy, thanks for the help.  This is the solution that I was looking for.  It works great.

Thanks for adding it to this post.  It was very much needed.

[Paul]

This also helped me. Thank you 

[Vessy]

Hi guys,

I am really glad the suggested solution is helpful for you in implementing your custom scenarios.

Regards,
Vessy
Telerik by Progress