Anonymous
Anonymous

Reputation: 111

Input File Click Chrome

Ok so I have an input element of type file and id "test"

When I put in the address bar: javascript: document.getElementById("test").click() it brings up the open file dialog so the user can decide what to upload. However if this same exact line is inserted into the document or done in the console of chrome it does not bring up the open file dialog. In fact the console says that the click() function is undefined. Is there any way in chrome to do this?

Cause it seem to work fine for any of the other browsers

Upvotes: 11

Views: 14068

Answers (2)

SparX
SparX

Reputation: 369

You should wrap file-input element to other (ex.:div): HTTM:

<div>
<input type='file'>
<div>

CSS:

div{
height:1px;
overflow: hidden;
}

JS:

$('div input').click();

Good luck...

Upvotes: 1

The Mighty Rubber Duck
The Mighty Rubber Duck

Reputation: 4478

I had the same problem and managed to solve it(though I am using jQuery). I detailed the technique in another question

Jquery trigger file input

The idea was essentially to focus the file input before triggering the click programatically.

Upvotes: 0

Related Questions