We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Any way to disable the view pane?

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


3 Replies

SA SureshRajan Alagarsamy Syncfusion Team February 23, 2023 04:20 PM UTC

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.



ZA Zachary February 23, 2023 05:21 PM UTC

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? 




SA SureshRajan Alagarsamy Syncfusion Team February 27, 2023 03:55 PM UTC

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.


Loader.
Up arrow icon