FileManager is filling up the layout on my screen?

Hi Team

I want to reduce the size of my fileManager, what it does currently its fully filling up the layout, i cant see other controls behind it. How can i resolve this not to happen?

Attachment: FileUpdate_bf8cb12f.zip

5 Replies

MK Muthukrishnan Kandasamy Syncfusion Team November 10, 2020 01:57 PM UTC

 
Hi Gcobani, 
 
Thanks for contacting Syncfusion support. 
 
Based on your provided details, we suspect that your requirement is to set the height and width for the File Manager component. For achieving your requirement, we suggest you to use the Width and Height property of File Manager component. 
 
 
 
 
Please let us know, if you need any further assistance. 
 
Regards, 
Muthukrishnan K 




GC Gcobani November 11, 2020 12:04 PM UTC

Hi Team

I am still not getting this right with height and width of my fileManager, mind if i share my code with you all.


@{
    ViewBag.Title = "File-Upload";
}

@{
    string[] files = new string[] { "Edit", "Open", "|", "Delete", "Download", "Rename", "|", "Details" };
    string[] folder = new string[] { "Edit", "Open", "|", "Delete", "Download", "Rename", "|", "Details" };
    string[] layout = new string[] { "Edit", "SortBy", "View", "Refresh", "|", "NewFolder", "Upload", "|", "Details", "|", "SelectAll" };
}

@using Syncfusion.EJ2;

<div class="control-section">
    <div class="float-right">

        @Html.EJS().FileManager("file").AjaxSettings(new Syncfusion.EJ2.FileManager.FileManagerAjaxSettings
   {
       Url = "/Home/FileOperations",
       GetImageUrl = "/Home/GetImage",
       UploadUrl = "/Home/Upload",
       DownloadUrl = "/Home/Download"

       // adding some extra functionality
   }).View(Syncfusion.EJ2.FileManager.ViewType.Details).DetailsViewSettings(new Syncfusion.EJ2.FileManager.FileManagerDetailsViewSettings
   {
       Columns = new List<Syncfusion.EJ2.FileManager.FileManagerColumn>
       {
           new Syncfusion.EJ2.FileManager.FileManagerColumn()
           {
               Field = "name", HeaderText = "File Name", MinWidth = "50", Width = "50"
           },
           new Syncfusion.EJ2.FileManager.FileManagerColumn()
           {
               Field = "frm_created", HeaderText = "Date Created", Width = "50"
           },

           new Syncfusion.EJ2.FileManager.FileManagerColumn()
           {
               Field = "frm_modified", HeaderText = "Date Modified", Width = "auto"
           },
           new Syncfusion.EJ2.FileManager.FileManagerColumn()
           {
               Field = "frm_modified_by", HeaderText = "Modified By", Width = "50"
           },
           new Syncfusion.EJ2.FileManager.FileManagerColumn()
           {
               Field = "size", HeaderText = "Size", Width = "50"
           }
       }

      }).Render()
    </div>
    </div>




MK Muthukrishnan Kandasamy Syncfusion Team November 12, 2020 12:27 PM UTC

 
Hi Gcobani, 
 
Thanks for the update. 
 
Based on your provided details, we suspect that your requirement is to fit the file manager columns width based on the available space. We have found that in your shared code, you have assigned 50px width for each column. For resolving your problem, we suggest you to use the width property as auto for file manager columns. Please refer to the below code block. 
 
    @Html.EJS().FileManager("file").AjaxSettings(new Syncfusion.EJ2.FileManager.FileManagerAjaxSettings 
    { 
       Url = "/Home/FileOperations", 
       GetImageUrl = "/Home/GetImage", 
       UploadUrl = "/Home/Upload", 
       DownloadUrl = "/Home/Download" 
 
       // adding some extra functionality 
   }).View(Syncfusion.EJ2.FileManager.ViewType.Details).DetailsViewSettings(new Syncfusion.EJ2.FileManager.FileManagerDetailsViewSettings 
   { 
       Columns = new List<Syncfusion.EJ2.FileManager.FileManagerColumn> 
       { 
           new Syncfusion.EJ2.FileManager.FileManagerColumn() 
           { 
               Field = "name", HeaderText = "File Name", Width = "auto" 
           }, 
           new Syncfusion.EJ2.FileManager.FileManagerColumn() 
           { 
               Field = "frm_created", HeaderText = "Date Created", Width = "auto" 
           }, 
 
           new Syncfusion.EJ2.FileManager.FileManagerColumn() 
           { 
               Field = "frm_modified", HeaderText = "Date Modified", Width = "auto" 
           }, 
           new Syncfusion.EJ2.FileManager.FileManagerColumn() 
           { 
               Field = "frm_modified_by", HeaderText = "Modified By", Width = "auto" 
           }, 
           new Syncfusion.EJ2.FileManager.FileManagerColumn() 
           { 
               Field = "size", HeaderText = "Size", Width = "auto" 
           } 
       } 
 
      }).Render() 
    </div> 
</div> 
 
 
We have prepared sample application for your convenience, which can be downloaded from the below link. 
 
 
Please check out the below output screenshot of the attached sample. 
 
 
 
If this solution still not resolve your problem, then share us video or screenshot of your reported problem/requirement in FileManager. If possible, replicate your reported problem in the above attached sample. Using which we can understand your problem and provide you the prompt solution. 
 
Please let us know, if you need any further assistance. 
 
Regards, 
Muthukrishnan K 



GC Gcobani November 13, 2020 09:48 AM UTC

Hi Team

I find it strange on my side, the layout for my FileManager still the same, i dont know because of _SideLineLayout is the one cause it not to display well. Here is an evidence and attached zip file for latest changes.



Attachment: eNtsaFileUpdate_5fbf54a3.zip


SA Shameer Ali Baig Sulaiman Ali Baig Syncfusion Team November 16, 2020 11:51 AM UTC

Hi Gcobani, 
 
A support incident to track the status of this defect has been created under your account. Please log on to our support website to check for further updates  
 
 
Regards, 
Shameer Ali Baig S. 


Loader.
Up arrow icon