File upload validation by JavaScript

Question

I want to restrict a file upload control to allow PDF files only. I want to use JavaScript for that.

I want to apply that JavaScript in file upload event.

All doable, but don't forget to validate on server side as well since JS can be disabled/spoofed. — BalusC
– BalusC, Commented May 29, 2010 at 13:46

kennytm · Accepted Answer · 2010-05-29 13:44:17Z

5

You can check the file name on submit.

"hook to the <form>'s onsubmit with whatever method" {
  filename = theFileElement.value;
  if (!/\.pdf$/i.test(filename)) {
    alert("error");
    return false;
  }
  return true;
}

Note that this only checks if the file has an extension of .pdf. It does not (and cannot) check whether the file is really a just PDF or actually a nasty virus. Moreover, client side Javascript can easily be bypassed, so you should perform the check again on the server side.

answered May 29, 2010 at 13:44

kennytm

526k110 gold badges1.1k silver badges1k bronze badges

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

5 Comments

Pointy Over a year ago

There are some APIs in modern releases of Firefox (and maybe the WebKit browsers) that allow some inspection of files. developer.mozilla.org/en/Using_files_from_web_applications

kennytm Over a year ago

@Pointy: True, but you can't deny users from using IE.

Pointy Over a year ago

Of course; the point is that it's not absolutely impossible for the client to examine files being uploaded, and eventually even IE will have that ability. (We may be long dead by then, of course.)

Rafee Over a year ago

@KennyTM Now how can i check with two type of formats like pdf and doc at a time

uzair Over a year ago

@Rafee if(!/(\.txt|\.pdf|\.exls|\.doc)$/i.test(document.formname.field)) It will restrict these types of documents.

Matt Fenwick · Accepted Answer · 2012-03-01 12:28:22Z

1

var ext = fname.split(".");
var x=ext.length;
if(ext[x-1] == 'pdf'){
  alert("Please upload doc file");
  document.form.fname.focus();
  return false;
}

edited Mar 1, 2012 at 12:28

Matt Fenwick

49.3k24 gold badges130 silver badges198 bronze badges

answered Mar 1, 2012 at 12:23

sivaraman

111 bronze badge

Collectives™ on Stack Overflow

File upload validation by JavaScript

2 Answers 2

5 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related