Selecting Item in FileManager with JavaScript

[Michael Smith]

We are using your FileManager component as part of an editor and wish to reselect an item in your component via javaScript onload.  I have looked through the documentation and have not found a way to do this.  Any help would be greatly appreciated.

[Indhumathy Loganathan]

Hi Michael, 

 

Greetings from Syncfusion support. 

 

We have validated your requirement in File Manager component. We understood that you want to maintain selections of folders and files in File Manager component. You can achieve this requirement by setting files/folder names to be selected in the selectedItems property. 

 

For your reference, we have prepared a sample where we added the items into selectedItems property in fileLoad event. Please check the below code snippet. 

 

function fileLoad(args) { 

  var array = ['Documents', 'Pictures']; 

  fileObject.selectedItems = array; 

} 

 

By using the above way, you can maintain the folder/files selection after navigations inside File Manager as well. If you want to maintain the state between page reloads, you can use our enablePersistence property. 

 

You can find the sample from below link. 

 

https://stackblitz.com/edit/v1rnjd?file=index.js 

 

Please check whether the shared details are helpful and let us know if you need any further assistance. 

 

Regards, 

Indhumathy L 

[Michael Smith]

I saw your example and it is almost what I am looking for.  I need to be able to select a singular file located in any depth of subfolder.  There could be multiple instances of a file in multiple folders.  I need to accomplish something like this:

var array = ['Pictures/Christmas.jpg'];

That example above doesn't work.  And if I simply say:

var array = ['Christmas.jpg'];

It will select every item that is named Christmas.jpg.

How can I specify a file path for a single item and have it be selected?  Thank you!

[Indhumathy Loganathan]

Hi Michael, 

 

We understood that you want to select the file under the specific folder instead of selecting all related occurrences inside File Manager. You can achieve this requirement just by comparing the filterPath in the fileLoad event. For your reference, we prepared a simple sample to demonstrate the solution. Please check the below code snippet. 

 

function fileLoad(args) { 

  //Compare the required path. 

  if (args.fileDetails.filterPath == '\\Pictures\\Food\\') { 

    //Pass the corresponding file name. 

    var array = ['Apple pie.png']; 

    fileObject.selectedItems = array; 

  } 

} 

 

You can find the sample demonstrating the solution from below link. 

 

https://stackblitz.com/edit/v1rnjd-bf7moj?file=index.js 

 

Please let us know if you need any further assistance. 

 

Regards, 

Indhumathy L