Telerik Forums
Kendo UI for jQuery Forum
0 answers
23 views

HI,

I am using Kendo jQuery.

FileManager is not showing the folder names , instead it is showing as "undefined".

 

Version :

        <!-- Kendo UI -->
        <script src="~/lib/kendo-ui-2023.3.1010/js/kendo.all.min.js"></script>
        <script src="~/js/kendo-ui-license.js" type="text/javascript"></script>

 

 

 

Visual Studio C# backend response  

 

c# Code :
public virtual JsonResult OnPostFileManagerRead(string target)

{
    try
    {
........
........
                var files = directoryBrowser.GetFiles(path, Filter);

                var directories = directoryBrowser.GetDirectories(path);

                var result = files.Concat(directories).Select(f => new
                {
                    Name = f.Name,
                    Size = f.Size,
                    Path = VirtualizePathString(f.Path),
                    Extension = f.Extension,
                    IsDirectory = f.IsDirectory,
                    HasDirectories = f.HasDirectories,
                    Created = f.Created,
                    CreatedUtc = f.CreatedUtc,
                    Modified = f.Modified,
                    ModifiedUtc = f.ModifiedUtc
                });



               return new JsonResult(result.ToArray());
            }
            catch (DirectoryNotFoundException)
            {
                throw new Exception("File Not Found");
            }
        }

        throw new Exception("Forbidden");
    }
    catch(Exception ex)
    {
        return new JsonResult(ex);
    }
}


Query :

1. What might be the issue ?

2. How can i resolve this issue ?

 

Developer
Top achievements
Rank 1
 updated question on 27 Feb 2024
0 answers
100 views

Hi,

There is an existing issue with File Manger pagination in List Mode (Grid Mode works fine).

The issue is that the paginator does not get updated with total count of items in the folder just opened/expanded.  The count remains the same as first/home page.

E.g.  On home page of file manager, I have 5 items ( 3 folders, 2 files)... so pager widget reads "1 - 5  of 5 items".

Once I click on a folder (one of the 5 items), it opens to show 50 (of 25000) files.  However, the paginator widget stays at "1 -5 of 5 items".   Thus leaving the user screwed because there are no pager links to get to next page of items as it thinks it has only 5 items in view when there are actually 50 in view, and it thinks total items are 5 instead of 25,000.

If I switch to Grid mode, it all works perfectly.  Both my list and grid views are configured exactly the same.

 

,
                                views: { 
                                list: {
                                    pageable: {
                                        alwaysVisible: true,
                                        pageSizes: [10, 20, 50, 100, 200, 300, 500, 1000]
                                    },
                                    pageable: true,
                                    selectable: "single" //allows only single selection int the ListView
                                },
                                grid: {
                                    pageable: {
                                        alwaysVisible: true,
                                        pageSizes: [10, 20, 50, 100, 200, 300, 500, 1000]
                                    },
                                    pageable: true,
                                    selectable: "single" //allows only single selection int the ListView
                                }

 

So an obvious bug...but when will there be a fix?  Or a workaround? Currently I am working on rolling my own here.  I have to trap the "open" event (double click)...and the  reset the datasource with the correct items for the folder clicked on, and update the datasurce totals...then it works fine...but i have lost context of parent folders by resetting the data source with items at folder level.

The way it is currently, list mode is useless in FileManager...unless your sub folders have less items than your root folder.

 

 

Michael
Top achievements
Rank 1
 asked on 19 Apr 2023
0 answers
153 views

Hi Team,

I am using file manager and I wanted to sort tree view elements in file manager based on some custom logic. Now by default it is sorting based on name. Is there any way to implement custom sorting?

jessen
Top achievements
Rank 1
 asked on 25 May 2022
0 answers
92 views

I am having an issue with the breadcrumb feature in the File Manager widget. No matter which breadcrumb link I click, it always takes me to the home directory. When I inspect the link, href is set to "#" for all of them. I'm not sure what I'm missing to make this work correctly. I've included my javascript, controller, and view. If other code is needed I can provide it. Thanks in advance for any help!

Javascript:

function loadFileManager() {

	$("#fileManager").kendoFileManager({
        draggable: false,
        resizable: true,
        dataSource: {
            transport: {
                read: {
                    url: $('#urlHolders').data('readFilesUrl'),
                    method: "POST"
                },
                create: {
                    url: $('#urlHolders').data('createFileUrl'),
                    method: "POST"
                },
                update: {
                    url: $('#urlHolders').data('updateFileUrl'),
                    method: "POST"
                },
                destroy: {
                    url: $('#urlHolders').data('destroyFileUrl'),
                    method: "POST"
                }
            }
        },
        uploadUrl: $('#urlHolders').data('uploadFileUrl'),
        toolbar: {
            items: [
                { name: "upload" },
                { name: "sortDirection" },
                { name: "sortField" },
                { name: "changeView" },
                { name: "spacer" },
                { name: "details" },
                { name: "search" }
            ]
        },
        contextMenu: {
            items: [
                { name: "rename" },
                { name: "delete" },
                { name: "download", text: "Download", command: "DownloadCommand", spriteCssClass: "k-icon k-i-download" }
            ],
            open: function (e) {
                //Executes when an item is right-clicked, before the context menu opens
                //We only want context menu actions to be available for files, not folders. So we intercept that here

                //Check whether the clicked item was a treeview item (folder)
                var isTreeviewItem = $(e.target).hasClass('k-treeview-item');

                //Check the clicked item for the folder icon class
                var isFolder = e.target.querySelector('.k-i-folder') != null;

                //if the clicked item a folder, do not open the context menu
                if (isTreeviewItem || isFolder) {
                    e.preventDefault();
                }
            }
        }
    });	

	var fileManager = $("#fileManager").getKendoFileManager();

	fileManager.executeCommand({ command: "TogglePaneCommand", options: { type: "preview" } });
	fileManager.toolbar.fileManagerDetailsToggle.switchInstance.toggle();

	var filemanagerNS = kendo.ui.filemanager;

	filemanagerNS.commands.DownloadCommand = filemanagerNS.FileManagerCommand.extend({
		exec: function () {
			var that = this,
				filemanager = that.filemanager, // get the kendo.ui.FileManager instance
				options = that.options, // get the options passed through the tool
				target = options.target // options.target is available only when command is executed from the context menu
			selectedFiles = filemanager.getSelected(); // get the selected files

			window.location = '/FileManager/Download?path=' + selectedFiles[0].path;

		}
	});
 
}

View:

<div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
    <h1 class="h2">File Manager</h1>
</div>

<div id="fileManagerContainer" class="wrapper">
    <div id="fileManagerContent">
        <div id="fileManager" class="rounded"></div>
    </div>
</div>

@section scripts {

    <script type="text/javascript">
        $(function () {
            loadFileManager();
        });

    </script>
}

Controller:

public class HomeController
{

	private readonly FileContentBrowser directoryBrowser;
	private const string contentFolderRoot = @"C:\Users\anna\Desktop\FileManagerContent";

	public HomeController(IPatientListService patientListService)
	{
		directoryBrowser = new FileContentBrowser(patientListService); // Helper utility for the FileManager controller
	}

	public ActionResult Index()
	{
		_auditService.LogEvent(new AuditEventModel
		{
			EventDef = EventDefinitions.PageOpened,
			EventItemName = AuditHelper.PageOpenedEventItemName(this.ControllerContext.RouteData)
		});

		return View("Index");
	}

	#region File Manager
	/// <summary>
	/// Gets the valid file extensions by which served files will be filtered.
	/// </summary>
	public string Filter
	{
		get
		{
			return "*.*";
		}
	}

	public JsonResult Read(string target)
	{
		var path = (string.IsNullOrWhiteSpace(target)) ? contentFolderRoot : target;
		int userId = User.Identity.GetUserId();

		try
		{
			directoryBrowser.Server = Server;

			var result = directoryBrowser.GetFiles(path, Filter).Concat(directoryBrowser.GetDirectories(path, userId));

			return Json(result, JsonRequestBehavior.AllowGet);
		}
		catch (DirectoryNotFoundException)
		{
			throw new HttpException(404, "File Not Found");
		}

		throw new HttpException(403, "Forbidden");
	}

	/// <summary>
	/// Updates an entry with a given entry.
	/// </summary>
	/// <param name="target">The path to the parent folder in which the folder should be created.</param>
	/// <param name="entry">The entry.</param>
	/// <returns>An empty <see cref="ContentResult"/>.</returns>
	/// <exception cref="HttpException">Forbidden</exception>
	public ActionResult Update(string target, FileManagerEntry entry)
	{
		FileManagerEntry newEntry;

		newEntry = RenameEntry(entry);

		return Json(newEntry);
	}

	public FileManagerEntry RenameEntry(FileManagerEntry entry)
	{
		var path = entry.Path;
		var physicalTarget = EnsureUniqueName(Path.GetDirectoryName(path), entry);
		FileManagerEntry newEntry;

		var file = new FileInfo(path);
		System.IO.File.Move(file.FullName, physicalTarget);
		newEntry = directoryBrowser.GetFile(physicalTarget);

		return newEntry;
	}

	public string EnsureUniqueName(string target, FileManagerEntry entry)
	{
		//Remove any extra file extensions that the user may have typed
		while (entry.Name.EndsWith(entry.Extension))
		{
			entry.Name = entry.Name.Remove(entry.Name.Length - entry.Extension.Length);
		}

		var fileName = entry.Name + entry.Extension;

		int sequence = 0;
		var physicalTarget = Path.Combine(target, fileName);

		//If the file name already exists, tack on a sequence #
		while (System.IO.File.Exists(physicalTarget))
		{
			fileName = entry.Name + String.Format("({0})", ++sequence) + entry.Extension;
			physicalTarget = Path.Combine(target, fileName);
		}

		return physicalTarget;
	}

	[HttpGet]
	public FileResult Download(string path)
	{
		FileInfo file = new FileInfo(path);

		System.Net.Mime.ContentDisposition cd = new System.Net.Mime.ContentDisposition
		{
			FileName = file.Name,
			Inline = false
		};
		Response.Headers.Add("Content-Disposition", cd.ToString());
		Response.Headers.Add("X-Content-Type-Options", "nosniff");

		string contentType = MimeMapping.GetMimeMapping(file.Name);
		var readStream = System.IO.File.ReadAllBytes(path);
		return File(readStream, contentType);

	}

	public ActionResult Destroy(FileManagerEntry entry)
	{
		var path = entry.Path;

		if (!string.IsNullOrEmpty(path))
		{
			DeleteFile(path);

			return Json(new object[0]);
		}
		throw new HttpException(404, "File Not Found");
	}

	public void DeleteFile(string path)
	{
		if (System.IO.File.Exists(path))
		{
			System.IO.File.Delete(path);
		}
	}

	/// <summary>
	/// Uploads a file to a given path.
	/// </summary>
	/// <param name="path">The path to which the file should be uploaded.</param>
	/// <param name="file">The file which should be uploaded.</param>
	/// <returns>A <see cref="JsonResult"/> containing the uploaded file's size and name.</returns>
	/// <exception cref="HttpException">Forbidden</exception>
	[AcceptVerbs(HttpVerbs.Post)]
	public virtual ActionResult Upload(string path, HttpPostedFileBase file)
	{
		var fileName = Path.GetFileName(file.FileName);

		if (true)
		{
			file.SaveAs(Path.Combine(path, fileName));

			return Json(new
			{
				size = file.ContentLength,
				name = fileName,
				type = "f"
			}, "text/plain");
		}

		throw new HttpException(403, "Forbidden");
	}
	
}

Anna
Top achievements
Rank 1
Iron
Iron
Iron
 asked on 12 Apr 2022
0 answers
62 views

 

I was configuration a directory in a directory by used File Manager.

 

After that whenever click the sub directory, parent directory move to left (created 'k-treeview-toggle').

 

What's that?

 

DEMO: multiple click the 'folder2' 

https://dojo.telerik.com/@handcake/EJucAmOF

jang
Top achievements
Rank 1
 updated question on 04 Feb 2022
Narrow your results
Selected tags
Tags
+? more
Top users last month
Mark
Top achievements
Rank 1
Yurii
Top achievements
Rank 1
Leland
Top achievements
Rank 2
Iron
Iron
Iron
Hon
Top achievements
Rank 1
Iron
Deltaohm
Top achievements
Rank 3
Bronze
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Mark
Top achievements
Rank 1
Yurii
Top achievements
Rank 1
Leland
Top achievements
Rank 2
Iron
Iron
Iron
Hon
Top achievements
Rank 1
Iron
Deltaohm
Top achievements
Rank 3
Bronze
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?