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
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.
Plamen Zdravkov
the Telerik team