Hacker News new | ask | show | jobs
by Sir_Cmpwn 3667 days ago
The dropdown and tooltips look useful, but FYI it's really simple to make a file picker. Just put a hidden input type="file" on the page, then:

    document.getElementById("that-element").addEventListener("change", function(e) {
        // e.target.files
    });
    document.getElementById("that-element").click();
1 comments

It's not so easy

    document.getElementById("that-element").click();
doesn't exist. You need to use something like

        /** Creates the click on the input */
        const clickEvent = document.createEvent( "MouseEvents" );
        clickEvent.initEvent( "click", true, false );
        document.getElementById("that-element").dispatchEvent( clickEvent );
References :

1 : https://developer.mozilla.org/en-US/docs/Web/API/EventTarget...

2 : http://stackoverflow.com/questions/6367339/trigger-a-button-...

EDIT ( sorry can't reply to you, because HN ) :

Relevant jQuery discussion

3 : https://github.com/jquery/jquery/issues/2476

Here's code I wrote a while ago that did exactly what I specified and worked in production on all major browsers:

https://github.com/MediaCrush/MediaCrush/blob/master/scripts...

Here's the code in the jQuery library you linked to that does exactly this as well:

https://github.com/component/file-picker/blob/master/index.j...

It has some problems with input type=file elements.

The devil is in the details, although obviously your code works for any other clickable elements.

1 : https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement... 2 : http://stackoverflow.com/questions/210643/in-javascript-can-...