New to Kendo UI for Vue? Start a free 30-day trial

File Restrictions

You can restrict the selected files for upload based on predefined rules for their size and/or extension.

Types of File Restrictions

The Upload supports three types of file restrictions:

File Extension

You can define the file types that are eligible for upload by using the allowedExtensions property. The files with extensions which are not included in the list will not be uploaded and the Upload will display them as invalid. The allowedExtensions option recognizes entries of both .type (for example, .docx, .png, .svg, .xls, and others) and type (for example, docx, png, svg, xls, and others) values.

Example
View Source
Change Theme:

Maximum File Size

You can restrict the maximum allowed file size (in bytes) by using the maxFileSize property. If the selected file exceeds the maximum size, an error message will be displayed.

Example
View Source
Change Theme:

Minimum File Size

You can restrict the minimum allowed file size (in bytes) by using the minFileSize property. If the selected file is less than the minimum size, an error message will be displayed.

Example
View Source
Change Theme:

Custom Restrictions

You can restrict the file with custom logic by using the validateFile property. For example we can check if the file name contains letter a as in the code below.

Example
View Source
Change Theme:

Browser Limitations

Internet Explorer versions up to and including version 9 provide no information on the file size. As a result, the Upload restriction for the minFileSize and maxFileSize options does not work.