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
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

add custom column to file manager detail view

Thread ID:

Created:

Updated:

Platform:

Replies:

150931 Jan 24,2020 02:49 PM UTC Feb 15,2021 12:08 PM UTC ASP.NET MVC - EJ 2 5
loading
Tags: FileManager
Unknown
Asked On January 24, 2020 02:49 PM UTC

how to add custom column next to file size in File manager control detail view

we want to show author/owner of the file. is it possible?

Ashokkumar Balasubramanian [Syncfusion]
Replied On January 27, 2020 12:34 PM UTC

Hi Mahesh,  
 
Good day to you. 
 
Yes, possible. We can add an additional column in detail view for File Manager component. Please refer the following code block. 
 
@Html.EJS().FileManager("filemanager").AjaxSettings(new Syncfusion.EJ2.FileManager.FileManagerAjaxSettings 
       { 
           Url = "/Home/FileOperations", 
           GetImageUrl = "/Home/GetImage", 
           UploadUrl = "/Home/Upload", 
           DownloadUrl = "/Home/Download" 
       }).View(Syncfusion.EJ2.FileManager.ViewType.Details).FileOpen("onFileOpen").DetailsViewSettings(new Syncfusion.EJ2.FileManager.FileManagerDetailsViewSettings 
            { 
           Columns = new List<Syncfusion.EJ2.FileManager.FileManagerColumn> 
           { 
              new Syncfusion.EJ2.FileManager.FileManagerColumn() 
              { 
                  Field="name", HeaderText = "File Name", MinWidth = "120", Width = "auto" 
              }, 
              new Syncfusion.EJ2.FileManager.FileManagerColumn() 
              { 
                  Field="dateModified", HeaderText = "Date Modified", MinWidth = "50", Width = "auto" 
              }, 
              new Syncfusion.EJ2.FileManager.FileManagerColumn() 
              { 
                  Field="size", HeaderText = "Size", MinWidth = "50", Width = "50" 
              }, 
              new Syncfusion.EJ2.FileManager.FileManagerColumn() 
              { 
                  Field="author", HeaderText = "Author", MinWidth = "50", Width = "50" 
              } 
           } 
   }).Render() 
 
 
Based on this additional added column, you need to return the corresponding author parameter in server side (Read Operation). 
 
Please let us know, if you have any concern on this. 
 
Regards, 
Ashokkumar B. 


Unknown
Replied On January 28, 2020 01:06 PM UTC

Thank you Ashok.

could you please share the API/event details for showing file size in kb/mb rather than bytes and parse time in datemodified column

Shameer Ali Baig Sulaiman Ali Baig [Syncfusion]
Replied On January 29, 2020 11:36 AM UTC

Hi Mahesh, 
 
You can use the fileLoad event of the EJ2 File Manager to achieve your requirement. This event will trigger before each file/folder is rendered in the File Manager. In the arguments of this event, the corresponding element, file details like name, created date, modified date, size and such etc., will be available using which you can perform the required customization. 
 
We have prepared a simple sample with customization using fileLoad for your reference. The same solution will be applied to the MVC platform. 
 
 
Please, let us know if you need further assistance. 
 
Regards, 
Shameer Ali Baig S. 


Mahesh Machina
Replied On February 12, 2021 01:42 PM UTC

is it possible to make Path column in Search clickable?

Sowmiya Padmanaban [Syncfusion]
Replied On February 15, 2021 12:08 PM UTC

Hi Mahesh Machina,  
 
Greetings from Syncfusion support. 
 
We have checked your requirement with FileManager component. Yes, you can add the anchor tag in the fileLoad event of FileManager component. FileLoad event is triggered while loading the files on search opeartions. 
 
Please, refer to the below code snippet. 
 
@Html.EJS().FileManager("file").AjaxSettings(new Syncfusion.EJ2.FileManager.FileManagerAjaxSettings 
     { 
         Url = "/Home/FileOperations", 
         GetImageUrl = "/Home/GetImage", 
         UploadUrl = "/Home/Upload", 
         DownloadUrl = "/Home/Download" 
     }).View(Syncfusion.EJ2.FileManager.ViewType.Details).FileLoad("fileLoad").Render() 
 
<script> 
    function fileLoad(args) { 
        var filemanager = document.getElementById("file").ej2_instances[0]; 
        if ( 
            filemanager.breadcrumbbarModule.searchObj.element.value != "" && 
            args.module == "DetailsView" 
        ) { 
            var anchorTag = document.createElement("a"); 
            var path_element = args.element.lastElementChild; 
            anchorTag.setAttribute("rel='nofollow' href", args.element.lastElementChild.innerText); 
            anchorTag.innerText = args.element.lastElementChild.innerText; 
            path_element.innerText = ""; 
            path_element.appendChild(anchorTag); 
        } 
    } 
</script> 
 
Please, refer the sample link below. 
 
 
Please let us know, if you need any further assistance. 
 
Regards,  
Sowmiya.P 



CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon