Any way to disable the view pane?

[Zachary]

I just want the navigation pane to show, and everything else to be disabled, for this project.

[SureshRajan Alagarsamy]

Hi Zachary,

Greetings from Syncfusion support.

Based on your query, we understand that you want to disable all the layouts except NavigationPane in the FileManager component. We have prepared a sample for you which will help you to achieve your requirement. In the sample, we have bound the ‘success’ event and disabled all the layouts except NavigationPane by adding the 'e-disabled' class to the layouts. Refer to the below code snippet for further assistance.

Code Snippet :

[index.js]

 

var hostUrl = 'https://ej2-aspcore-service.azurewebsites.net/';

var fileObject = new ej.filemanager.FileManager({

        ajaxSettings: {

            url: hostUrl + 'api/FileManager/FileOperations',

            getImageUrl: hostUrl + 'api/FileManager/GetImage',

            uploadUrl: hostUrl + 'api/FileManager/Upload',

            downloadUrl: hostUrl + 'api/FileManager/Download'    

        },

        toolbarSettings: { items: ['NewFolder', 'SortBy', 'Refresh', 'View', 'Details', 'Cut', 'Copy', 'Delete', 'Download', 'Rename'] },

        view: 'Details',

        success: onSuccess

});

fileObject.appendTo('#filemanager');

 

function onSuccess(args){

    document.getElementById("filemanager_toolbar").classList.add('e-disabled')

    document.getElementById("filemanager_grid").classList.add('e-disabled')

    document.getElementById("filemanager_breadcrumbbar").classList.add('e-disabled')

}

 

For your reference, we have attached the sample.

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

Check out the shared details and get back to us if you need any further assistance.

Regards,
Suresh.

[Zachary]

Thanks for the response.

However, this just grays everything except the navigation pane out. Is it possible to hide it all and only see this, or am I misunderstanding? 

[SureshRajan Alagarsamy]

Hi Zachary,

We can tell from the information you provided that you want the NavigationPane to be visible while hiding all other layouts in the FileManager component. We would like to suggest that you can render our Syncfusion TreeView component, which has the same structure that you expect.

Refer to the attached demo and document link to learn about our TreeView UI and functionalities.

Demo : https://ej2.syncfusion.com/javascript/demos/#/bootstrap5/treeview/default.html

Documentation : https://ej2.syncfusion.com/javascript/documentation/treeview/es5-getting-started/

If the TreeView component does not meet your requirements, we will gladly assist you in achieving the requirement in the FileManager component itself through customization.

Regards,
Suresh.