File Size Validation Based on Upload Content Type

[Phani]

Dear Team,

 We are using RadCloudUpload control for uploading Images and Videos. The same control should allow both Image and Video upload.

 But if user is uploading an Image, file size should be restricted to 10MB, for Video upload file max file size restriction should be 200MB.

Is there a way to implement file size validation on client side based on content type? Please suggest. Thanks in advance.  

<telerik:RadCloudUpload ID="RadCloudUpload1" runat="server" CssClass="btn btn-green center-block" OnClientUploadFailed="onClientUploadFailed" OnClientValidationFailed="onClientUploadFailed" OnFileUploaded="RadCloudUpload1_FileUploaded" DropZones="#dragDrop"
                           OnClientFilesUploaded="fileUploaded"   ProviderType="Azure" MaxFileSize="10486000" AllowedFileExtensions=".jpg,.jpeg,.png,.gif,.mpg,.mp4,.avi,.mov,.qt,.3gp,.m4v,.mpg,.mpeg,.mp4v,.h264,.wmv,.mpg4,.movie,.m4u,.flv,.dv,.mkv,.mjpeg,.asf,.ogv,.mts,.mvi" MultipleFileSelection="Automatic">
                       </telerik:RadCloudUpload>

 

 

 

 

[Nencho]

Hello Phani,

For this functionality, you would need to implement some custom logic. You can use the OnClientFIleSelected client-side event of the RadCloudUpload, in order to store the currently selected file's Name and Size in an array. Then, at the OnClientFileUploading you can access from the array the size of the file, corresponding to the name of the currently uploading one. Then, if the size exceeds the values, you can use the args.set_cancel(true) function, in order to cancel the upload of the file.

<telerik:radcloudupload runat="server" id="RadCloudUpload1" providertype="Amazon"
                onclientfileselected="fileSelected" onclientfileuploading="OnClientFileUploading"></telerik:radcloudupload>

<script type="text/javascript">
            var filesArray = new Array();

            function OnClientFileUploading(sender, args) {
                for (var i = 0; i < filesArray.length; i++) {
                    if (filesArray[i].name == args.get_fileName()) {
                        var size = filesArray[i].size;
                        //if the file's size exceeds the predefined value you can cancel the event
                        // with args.set_cancel(true)
                    }
                }
            }
            function fileSelected(sender, args) {
                var inputs = document.getElementsByClassName('rcuFileInput');
                var input = inputs[0];
                var file = input.files[0];
                var name = file.name;
                var size = file.size;

                filesArray.push({ name: name, size: size });
            }
        </script>

Regards,
Nencho
Telerik