multiple file validation using javascript

Question

I am trying to upload multiple files via

<input type="file" id="uploadFiles" multiple onchange="checkFileUploadExt(this);"/>

using javascript

function checkFileUploadExt(fieldObj)
{
    var control = document.getElementById("uploadFiles");
    var filelength = control.files.length;
    var FileName = fieldObj.value;
    var FileExt = FileName.substr(FileName.lastIndexOf('.') + 1);       
    if ((FileExt.toUpperCase() != "PDF"))
        if ((FileExt !== "pdf") || (FileExt !== "PDF"))
        {
            var error = "File type : " + FileExt + "\n\n";
            error += "Please make sure your file is in pdf  format .\n\n";
            alert(error);
            fieldObj.value = '';
            return false;
        }  

    return true;
}

but here

multiple pdf files->success

single other files(.txt,.doc etc)->success

pdf+(txt or doc)-> fail

my need is only pdf files can accept when multiple selection. and also it shows errors in files.length on Interner Explorer how to do this

Super Hornet · Accepted Answer · 2015-01-03 07:21:06Z

3

try this:

function checkFileUploadExt(fieldObj) {
  var control = document.getElementById("uploadFiles");
  var filelength = control.files.length;

  for (var i = 0; i < control.files.length; i++) {
    var file = control.files[i];
    var FileName = file.name;
    var FileExt = FileName.substr(FileName.lastIndexOf('.') + 1);
    if ((FileExt.toUpperCase() != "PDF")) {
      var error = "File type : " + FileExt + "\n\n";
      error += "Please make sure your file is in pdf  format .\n\n";
      console.error(error);
    }
  }
}

<input type="file" id="uploadFiles" multiple onchange="checkFileUploadExt(this);" />

answered Jan 3, 2015 at 7:21

Super Hornet

2,9275 gold badges31 silver badges58 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

shahanas sulthan Over a year ago

pdf+doc->success , doc+pdf-> fails

Super Hornet Over a year ago

My answer just checks if the selected files format is correct or not and logs the wrong ones

shahanas sulthan Over a year ago

here i have to select single or multiple pdf files only.but here when i select two files exaple a doc and pdf it fails but pdf and doc it become success(i mean the selection order).

Super Hornet Over a year ago

with my code, there is no difference with the order

shahanas sulthan Over a year ago

just run in code snippet in the order (1).docx (2).pdf [select both with control tab]

Rahul Desai · Accepted Answer · 2015-01-03 07:53:42Z

Try using the accept filter instead.

Here's a demo:

<input name="file1" type="file" accept="application/pdf" multiple />

PS: It doesnt work in Firefox.

Alternate and Promising solution:

document.getElementById("uploadFiles").onchange = function(){  // on selecting file(s)
    for(var file in this.files){ // loop over all files
        if(isNaN(file) === false){  // if it is actually a file and not any other property
            if(this.files[file].type !== "application/pdf"){ // if NOT PDF!!
                alert('Please select PDF files only.');
                return false;
            }
        }
    }
    
    alert('Yay!! All selected files are in PDF format.');
    return true;
}

<input type="file" id="uploadFiles" multiple accept="application/pdf" />

PS: This works in Firefox too!

Collectives™ on Stack Overflow

multiple file validation using javascript

2 Answers 2

5 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related