Telerik Forums
Kendo UI for jQuery Forum
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
3 answers
159 views

How do you data bind items. 
We can bind value like so:

data-bind="value: value"

but cannot bind to an array of items in the same manner. 

data-items="items" also doesn't seem to work.

Ivan Danchev
Telerik team
 answered on 21 Dec 2020
2 answers
369 views

Hi, Dev Team!

Sometimes my breadcrumb width are bigger than device width and breadcrumb items become hidden.
How i can keep breadcrumb items always visible with line break if it needed?

 

https://demos.telerik.com/kendo-ui/breadcrumb/index

Andrey
Top achievements
Rank 1
Veteran
 answered on 07 Aug 2020
1 answer
80 views
Hi, Dev Team!

I stacked with problem when develop my solution on offline server. No one error via page loading. But breadcrumb looks broken.

Other kendo UI controls work properly. Please help with this issue.
Aleksandar
Telerik team
 answered on 25 Jun 2020
2 answers
54 views

Hi, Dev Team!

Where i can retrieve all list of possible icons for breadcrumb?

Thank you.

Andrey
Top achievements
Rank 1
Veteran
 answered on 13 Feb 2020
4 answers
632 views

Hi, Dev Team!

At first, really thank you for Breadcrumb!

How i can set items programmatically or bind to dataSource?

Andrey
Top achievements
Rank 1
Veteran
 answered on 30 Jan 2020
Narrow your results
Selected tags
Tags
+? more
Top users last month
Dominik
Top achievements
Rank 1
Giuliano
Top achievements
Rank 1
Dominic
Top achievements
Rank 1
Glendys
Top achievements
Rank 1
Iron
NoobMaster
Top achievements
Rank 2
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Dominik
Top achievements
Rank 1
Giuliano
Top achievements
Rank 1
Dominic
Top achievements
Rank 1
Glendys
Top achievements
Rank 1
Iron
NoobMaster
Top achievements
Rank 2
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?