Navigation in filemanager navigationpage directories through external/parent component

I am passing value of directory which I want to open through parent component which is working as side navigation panel of my application. How I can use the directory value for navigation in FileManager 


3 Replies

VM Vishwanathan Muruganantham Syncfusion Team November 5, 2024 01:51 PM UTC

Hi Mayank,


Greetings from Syncfusion support.


We have reviewed your query and understand that you need to open a specific directory. We suggest using the “path” property of the FileManager component, which will load the directory specified by the path property.


Refer to the code snippet below for reference.


…..

 

    let path = "/Music/"

    return (<div>

            <div className="control-section">

                <FileManagerComponent id="overview_file" ajaxSettings={{ url: hostUrl + "api/FileManager/FileOperations", getImageUrl: hostUrl + "api/FileManager/GetImage", uploadUrl: hostUrl + 'api/FileManager/Upload', downloadUrl: hostUrl + 'api/FileManager/Download' }}  view={"Details"} path={path}>

                    <Inject services={[NavigationPane, DetailsView, Toolbar]}/>

                </FileManagerComponent>

            </div>

        </div>);

};

….


Sample: https://stackblitz.com/edit/react-1uqk7j-vbohgv?file=index.js


Please check the sample and let us know if you need any further assistance.


Best Regards,
Vishwanathan



MT Mayank Tanwar November 6, 2024 11:33 AM UTC

I am having a folder which is named as summary and while providing "/Summary" or "/Summary" it is taking "/" in payload of operations API. And if I provide "Summary" it is giving me 404 error.



VM Vishwanathan Muruganantham Syncfusion Team November 8, 2024 12:50 PM UTC

Hi Mayank,


We have reviewed your query and understand that you are facing an issue when using the folder name in the path property. If the path is mismatched or a folder with the same name is found, it will load the root path. We suggest you add a forward slash at the end of the folder name and try using this path: “/Summary/” in the FileManager component. If the issue persists, please share the complete code details, folder structure, and a video demonstrating the issue. These details will help us provide a prompt solution.


Best Regards,
Vishwanathan


Loader.
Up arrow icon