New to Telerik UI for ASP.NET Core? Start a free 30-day trial

Upload in Razor Pages

Updated on Dec 10, 2025

This article describes how to seamlessly integrate and configure the Telerik UI Upload for ASP.NET Core in Razor Pages applications.

Referencing Handler Methods in Razor Pages

Razor Pages is an alternative to the MVC pattern that makes page-focused coding easier and more productive. This approach consists of a cshtml file and a cshtml.cs file (by convention, the two files have the same name).

The cshtml.cs file, known as the PageModel, contains handler methods that respond to HTTP requests. These methods are prefixed with On followed by the HTTP verb (for example, OnGet, OnPost, OnPostRead, OnPostCreate).

Handler methods declared in a PageModel can be referenced from any Razor Page using one of the following URL patterns:

Using Url.Page()
C#
```
Url.Page("PageName", "HandlerName")
// OR
Url.Page("/FolderName/PageName", "HandlerName")
```
For example, Url.Page("Index", "Read") references the OnPostRead or OnGetRead handler method in the Index.cshtml.cs file.
Using a query string
C#
```
Url("/PathToPage?handler=HandlerName")
```
For example, Url("/Index?handler=Read") references the OnPostRead or OnGetRead handler method in the Index page.

For more information on Razor Pages architecture and concepts, refer to the official Microsoft documentation.

Getting Started

The following example demonstrates how to configure the Upload component for asynchronous file uploads with save and remove operations in a Razor Pages application.

Razor
@page
@model UploadIndexModel

@inject Microsoft.AspNetCore.Antiforgery.IAntiforgery Xsrf
@Html.AntiForgeryToken()

<h1>UploadIndex</h1>

@(Html.Kendo().Upload()
	.Name("files")
	.Async(a => a
		.SaveUrl("/UploadIndex?handler=Save")
		.RemoveUrl("/UploadIndex?handler=Remove")
		.AutoUpload(true)
	)
	.Validation(validation => validation.AllowedExtensions(new string[] { ".jpg" , ".png", ".jpeg" }))
    .Validation(validation => validation.MaxFileSize(2000000))
)
Razor
@page
@model UploadIndexModel

@inject Microsoft.AspNetCore.Antiforgery.IAntiforgery Xsrf
@Html.AntiForgeryToken()

@{
    string[] extensions = { ".jpeg", ".jpg", ".png" };
}

<h1>UploadIndex</h1>

<kendo-upload name="files">
    <async remove-url="@Url.Page("UploadIndex","Remove")" save-url="@Url.Page("UploadIndex","Save")" auto-upload="true" />
    <validation allowed-extensions="@extensions" max-file-size="2000000" />
</kendo-upload>
C#
public class UploadIndexModel : PageModel
{
	public void OnGet()
	{
	}

	public ActionResult OnPostSave(IEnumerable<IFormFile> files)
	{
		// The Name of the Upload component is "files"
		if (files != null)
		{
			foreach (var file in files)
			{
				var fileContent = ContentDispositionHeaderValue.Parse(file.ContentDisposition);

				//// Some browsers send file names with full path.
				//// We are only interested in the file name.
				var fileName = Path.GetFileName(fileContent.FileName.Trim('"'));
				var physicalPath = Path.Combine("App_Data", fileName);

				//// The files are not actually saved in this demo
				////file.SaveAs(physicalPath);
			}
		}

		// Return an empty string to signify success
		return Content("");
	}

	public ActionResult OnPostRemove(string[] fileNames)
	{
		// The parameter of the Remove action must be called "fileNames"

		if (fileNames != null)
		{
			foreach (var fullName in fileNames)
			{
				var fileName = Path.GetFileName(fullName);
				var physicalPath = Path.Combine("App_Data", fileName);

				// TODO: Verify user permissions

				if (System.IO.File.Exists(physicalPath))
				{
					// The files are not actually removed in this demo
					// System.IO.File.Delete(physicalPath);
				}
			}
		}

		// Return an empty string to signify success
		return Content("");
	}
}

For the complete project, refer to the Upload in Razor Pages example.

Upload in Razor Pages

Referencing Handler Methods in Razor Pages

Getting Started

See Also