This is a migrated thread and some comments may be shown as answers.

Urgent questions about OnClientValidationFailed event

1 Answer 98 Views
AsyncUpload
This is a migrated thread and some comments may be shown as answers.
Yi Ling
Top achievements
Rank 1
Yi Ling asked on 04 May 2012, 07:00 PM
Hi Telerik,

Below is my code.  Before I add OnclientvalidationFailed event and specify MaxFileSize, everything works fine.  However, after I added this event, the code in my onclientfileuploaded does not function well.

What happened was -
(1), (3), (5) are still on the list, while I am expecting only (1), (3) on the list.

Steps to reproduce an error -
(1) upload a good file - e.g. Doc1
(2) upload a file which is more than 2 mb
(3) upload a different good file - e.g. doc2
(4) upload a too large file
(5) upload (1)'s file

This is very urget.  Please kindly help.

Thanks!

Joan




HTML -

<

 

 

div id="uploadDiv" class="uploadDiv">

 

<telerik:radasyncupload id="inputFile" runat="server" temporaryfileexpiration="02:00:00" MaxFileSize="2097152"

 

allowedfileextensions="gif,png,jpg,jpeg,bmp,pdf,doc,docx,csv,xls,xlsx,xlt,txt,rtf,msg,ppt,pptx,msi"

 

onclientfileselected="OnFileSelected" onclientfilesuploaded="OnFilesUploaded"

 

onclientprogressupdating="OnProgressUpdating" onclientfileuploaded="OnFileUploaded"

 

onclientfileuploadremoved="OnFileUploadRemoved" OnClientValidationFailed="OnClientValidationFailed"

 

OnClientFileUploadFailed="OnFileUploadFailed"

 

>

Javascript -

 

<

 

 

 

 

 

 

 

 

script type="text/javascript">

 

 

 

 

 

var MAX_TOTAL_BYTES = 2097152;

 

 

 

 

 

var filesSize = new Array();

 

 

 

 

 

var OVERSIZE_MESSAGE = "Maximum total upload size is 2MB";

 

 

 

 

 

var isDuplicateFile = false;

 

 

 

 

 

var fileCount = 0;

 

 

 

 

 

var uploadingFiles =[];

 

 

 

 

 

var uploadsInProgress = 0; //add new code - start

 

 

 

 

 

function OnFileSelected(sender, args) {

 

 

 

 

 

for (var fileindex in sender._uploadedFiles) {

 

 

 

 

 

if (sender._uploadedFiles[fileindex].fileInfo.FileName == args.get_fileName()) {

isDuplicateFile =

 

 

 

 

 

true;

}

}

 

 

 

 

 

//add new code - start

 

 

 

 

 

if (!uploadsInProgress) {

}

uploadsInProgress++;

 

 

 

 

 

//add new code - end

}

 

 

 

 

 

function OnFilesUploaded(sender, args) {

 

 

 

 

 

if (sender._uploadedFiles.length == 0) {

filesSize =

 

 

 

 

 

new Array();

 

 

 

 

 

//add new code - start

uploadsInProgress = 0;

 

 

 

 

 

//add new code - end

}

 

 

 

 

 

//add new code - start

 

 

 

 

 

if (uploadsInProgress > 0) {

DecrementUploadsInProgress();

}

 

 

 

 

 

//add new code - end

}

 

 

 

 

 

function OnProgressUpdating(sender, args) {

filesSize[args.get_data().fileName] = args.get_data().fileSize;

 

}

 

 

 

 

 

function OnFileUploaded(sender, args) {

 

 

 

 

 

/*original code

var totalBytes = 0;

var numberOfFiles = sender._uploadedFiles.length;

if (isDuplicateFile) {

sender.deleteFileInputAt(numberOfFiles - 1);

isDuplicateFile = false;

sender.updateClientState();

if (args.get_fileName() != null)

{ alert(args.get_fileName() + ' ' + 'already exists.'); }

else

{ alert('File already exists.'); }

return;

}

for (var index in filesSize) {

totalBytes += filesSize[index];

}

if (totalBytes > MAX_TOTAL_BYTES) {

sender.deleteFileInputAt(numberOfFiles - 1);

sender.updateClientState();

alert(OVERSIZE_MESSAGE);

}

*/

 

 

 

 

 

 

 

//sender.set_enabled(true);

 

 

 

 

 

var totalBytes = 0;

 

 

 

 

 

var wrongfileIndex = null;

 

 

 

 

 

var numberOfFiles = sender._uploadedFiles.length;

 

 

 

 

 

var deletedFileName = null;

 

 

 

 

 

if (isDuplicateFile) {

 

 

 

 

 

//replace with the following

 

 

 

 

 

var col = sender.getUploadedFiles();

 

 

 

 

 

for (var fileindex in sender.getUploadedFiles()) {

 

 

 

 

 

if (col[fileindex] == args.get_fileName()) {

wrongfileIndex = fileindex;

 

 

 

 

 

if (wrongfileIndex != null) {

 

 

 

 

 

if (deletedFileName == null) {

deletedFileName = args.get_fileName();

sender.deleteFileInputAt(wrongfileIndex);

}

 

 

 

 

 

else {

 

 

 

 

 

if (deletedFileName == args.get_fileName()) {

deletedFileName=

 

 

 

 

 

null;

}

}

}

}

}

isDuplicateFile =

 

 

 

 

 

false;

sender.updateClientState();

 

 

 

 

 

if (args.get_fileName() != null)

{ alert(args.get_fileName() +

 

 

 

 

 

' ' + 'already exists.'); }

 

 

 

 

 

else

{ alert(

 

 

 

 

 

'File already exists.'); }

col = sender.getUploadedFiles();

 

 

 

 

 

return;

}

 

 

 

 

 

for (var index in sender._uploadedFiles) {

totalBytes += sender._uploadedFiles[index].fileInfo.ContentLength;

}

 

 

 

 

 

if (totalBytes > MAX_TOTAL_BYTES) {

 

 

 

 

 

//sender.deleteFileInputAt(numberOfFiles - 1);

 

 

 

 

 

//replace with the following

 

 

 

 

 

var col = sender.getUploadedFiles();

 

 

 

 

 

for (var fileindex in sender.getUploadedFiles()) {

 

 

 

 

 

if (col[fileindex] == args.get_fileName()) {

wrongfileIndex = fileindex;

 

 

 

 

 

if (wrongfileIndex != null) {

sender.deleteFileInputAt(wrongfileIndex);

}

}

}

col = sender.getUploadedFiles();

sender.updateClientState();

col = sender.getUploadedFiles();

alert(OVERSIZE_MESSAGE);

}

}

 

 

 

 

 

function OnFileUploadRemoved(sender, args) {

 

 

 

 

 

if (args.get_fileName() != null) {

 

 

 

 

 

if (!isDuplicateFile) {

 

 

 

 

 

delete filesSize[args.get_fileName()];

}

 

 

}

}

 

 

 

 

 

function OnFileUploadFailed(sender, args) {

DecrementUploadsInProgress();

}

 

 

 

 

 

function ConfigureSuccessfullyUploadedMessage(docName) {

$ = $telerik.$;

 

 

 

 

 

var attPanel = $(".info-panel");

 

 

 

 

 

var divs = attPanel[0].all;

 

 

 

 

 

for (var i = 0; i < divs.length; i++) {

 

 

 

 

 

var element = divs[i];

 

 

 

 

 

if (element.innerText == docName) {

element.style.display =

 

 

 

 

 

"none";

 

 

 

 

 

if (fileCount > 0) {

fileCount = fileCount - 1;

}

}

}

}

 

 

 

 

 

function OnClientFileUploading(sender, args) {

 

 

 

 

 

/*$telerik.$(".ruCancel").bind('click', function (e) {

$telerik.$(this).parent().remove();

});*/

 

 

}

 

 

 

 

 

function OnClientValidationFailed(sender, eventArgs) {

 

 

 

 

 

/*original code

alert('Wrong file type: ' + eventArgs.get_fileName());

$telerik.$(eventArgs.get_row()).css("display", "none");

*/

 

 

 

 

 

 

 

//check if validation fails because of wrong extenstion

 

 

 

 

 

if(!checkFileExt(eventArgs.get_fileName()))

{

alert(

 

 

 

 

 

'Wrong file type: ' + eventArgs.get_fileName());

}

 

 

 

 

 

else

{

alert(OVERSIZE_MESSAGE +

 

 

 

 

 

'. ' + eventArgs.get_fileName() + ' is too large.');

}

$telerik.$(eventArgs.get_row()).css(

 

 

 

 

 

"display", "none");

}

 

 

 

 

 

function checkFileExt(elem) {

 

 

 

 

 

var filePath = elem;

 

 

 

 

 

if (filePath.indexOf('.') == -1)

 

 

 

 

 

return false;

 

 

 

 

 

var validExtensions = new Array();

 

 

 

 

 

var ext = filePath.substring(filePath.lastIndexOf('.') + 1).toLowerCase();

validExtensions[0] =

 

 

 

 

 

'gif';

validExtensions[1] =

 

 

 

 

 

'png';

validExtensions[2] =

 

 

 

 

 

'jpg';

validExtensions[3] =

 

 

 

 

 

'jpeg';

validExtensions[4] =

 

 

 

 

 

'bmp';

validExtensions[5] =

 

 

 

 

 

'pdf';

validExtensions[6] =

 

 

 

 

 

'doc';

validExtensions[7] =

 

 

 

 

 

'docx';

validExtensions[8] =

 

 

 

 

 

'csv';

validExtensions[9] =

 

 

 

 

 

'xls';

validExtensions[10] =

 

 

 

 

 

'xlsx';

validExtensions[11] =

 

 

 

 

 

'xlt';

validExtensions[12] =

 

 

 

 

 

'txt';

validExtensions[13] =

 

 

 

 

 

'rtf';

validExtensions[14] =

 

 

 

 

 

'msg';

validExtensions[15] =

 

 

 

 

 

'ppt';

validExtensions[16] =

 

 

 

 

 

'pptx';

validExtensions[16] =

 

 

 

 

 

'msi';

 

 

 

 

 

for (var i = 0; i < validExtensions.length; i++) {

 

 

 

 

 

if (ext == validExtensions[i])

 

 

 

 

 

return true;

}

 

 

 

 

 

return false;

}

 

 

 

 

 

//add new code - start

 

 

 

 

 

function DecrementUploadsInProgress() {

uploadsInProgress--;

 

 

 

 

 

if (!uploadsInProgress) {

$telerik.$(

 

 

 

 

 

".ruBrowse").removeAttr("disabled");

$telerik.$(

 

 

 

 

 

".ruFakeInput").removeAttr("disabled");

 

}

}

 

 

 

 

 

//add new code - end

 

 

 

 

 

function OnClientAdded(sender, args) {

alert(

 

 

 

 

 

'Added');

}

 

 

 

 

 

//occurs when file commence uploading

 

 

 

 

 

function OnClientFileUploading(sender, eventArgs) {

 

 

 

 

 

//cancel the upload

 

 

 

 

 

//eventArgs.set_cancel(true);//not working

alert(

 

 

 

 

 

'no duplicate file: ' + args.get_fileName());

 

 

 

 

 

//hide the uploading item

$telerik.$(eventArgs.get_row()).css(

 

 

 

 

 

"display", "none");

 

 

 

 

 

//check if uploading files contain the new updating file

 

 

 

 

 

var _containDuplicateFile = false;

 

 

 

 

 

if (uploadingFiles != null && uploadingFiles.length > 0) {

 

 

 

 

 

for (var i = 0; i < uploadingFiles.length; i++) {

 

 

 

 

 

if (uploadingFiles[i] == args.get_fileName()) {

_containDuplicateFile =

 

 

 

 

 

true;

 

 

 

 

 

break;

}

}

}

 

 

 

 

 

if (_containDuplicateFile) {

 

 

 

 

 

//cancel the upload

args.set_cancel(

 

 

 

 

 

true);

alert(

 

 

 

 

 

'no duplicate file: ' + args.get_fileName());

 

 

 

 

 

//hide the uploading item

$telerik.$(args.get_row()).css(

 

 

 

 

 

"display", "none");

}

 

 

 

 

 

else if (!_containDuplicateFile) {

uploadingFiles[args.get_fileName()] = args.get_fileName();

}

}

 

 

 

 

 

</script>

 

 

 

1 Answer, 1 is accepted

Sort by
0
Plamen
Telerik team
answered on 09 May 2012, 09:34 AM
Hello Joan,

 
It seems that when deleting files at particular position you are getting the uploaded files minus one which deletes the forth file instead of the fifth one. I will recommend you to use sender.deleteFileInputAt(numberOfFiles) instead of sender.deleteFileInputAt(numberOfFiles - 1).

Hope this will be helpful.

Greetings,
Plamen Zdravkov
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Tags
AsyncUpload
Asked by
Yi Ling
Top achievements
Rank 1
Answers by
Plamen
Telerik team
Share this question
or