Name validation when upload files

// get the files name

<Upload onAdd={(e) => this.handleAddFile(e)} />

handleAddFile = (e) => {

console.log("file name",e.affectedFiles[0].name)
} I can use this to get the files name, and I want to do a name validation, such as the file`s name must be  like AL-13-Annual.pdf. How to pervent upload if the name is not match?

 

Hello, Xin,

This can be achieved using the following approach:

1) Set the component in controlled mode by using the files property. This will allow controlling which files will be added for upload:|

https://www.telerik.com/kendo-react-ui/components/upload/api/UploadProps/#toc-files

2) Set the autoUpload to false to prevent the automatic upload:

https://www.telerik.com/kendo-react-ui/components/upload/api/UploadProps/#toc-autoupload

3) Utilize the onAdd event where based on the file name will either add the file to the files collection or not:

https://www.telerik.com/kendo-react-ui/components/upload/api/UploadProps/#toc-onadd

This is an example demonstrating this:

https://stackblitz.com/edit/react-3x6dal?file=app/main.js

If this is not possible in the real example please share more details. Also, if you have a suggestion on how this can be optimized please let us know we value the feedback very high.

Regards,
Stefan
Progress Telerik

Thanks Stefan