FileSelect File Validation
If you want to validate the selected files, you should implement the validation in two parts:
- Client validation—performed by the Telerik FileSelect component
- Server validation—must be implemented in the application backend or endpoints
Parameters
The Telerik FileSelect component offers parameters to validate the file selection on the client:
AllowedExtensionsMinFileSizeMaxFileSize
Selected files that don't meet the defined criteria are marked as invalid in the component UI.
The FileSelect also provides an Accept parameter. It does not enforce validation, but instructs the browser what file types to allow users to select. This can also help users find the correct files more easily.
Events
The FileSelect fires its OnSelect and OnRemove events for both valid and invalid files. The application can confirm file validity through the event argument properties and decide how to proceed.
Example
For brevity, the code below does not handle the selected file. See a full example in the FileSelect Events article.
Telerik FileSelect file validation
<TelerikFileSelect AllowedExtensions="@AllowedExtensions"
MinFileSize="@MinSize"
MaxFileSize="@MaxSize"
Multiple="false"
OnSelect="@OnFileSelect">
</TelerikFileSelect>
<div class="k-form-hint">
Expected files: JPG, PNG, SVG between 1 KB and 4 MB.
</div>
@code {
private readonly List<string> AllowedExtensions = new List<string>() { ".jpg", ".jpeg", ".png", ".svg" };
private const int MinSize = 1024;
private const int MaxSize = 4 * 1024 * 1024;
private void OnFileSelect(FileSelectEventArgs args)
{
FileSelectFileInfo file = args.Files.First();
if (file.InvalidExtension || file.InvalidMaxFileSize || file.InvalidMinFileSize)
{
// Optionally, ignore the user action completely.
// The selected file(s) will not appear in the file list.
//args.IsCancelled = true;
return;
}
// Handle selected valid file...
}
}File handling, saving and deletion can create application vulnerabilities. This includes any related controller methods. Learn about all possible security risks and how to avoid them. Do not trust the user files or requests, and implement server-side validation.
The code examples in this documentation do not implement security measures for simplicity and brevity.