CODEWITHSUNDEEP
javascriptjqueryhtml
Victor
Victor

Reputation: 14583

Opening a file dialog without FILE input

I've seen this website. If you click on the center element, it opens a file dialog so you can upload an image. I know how to open a file dialog by using an input[type=file].

How can I open the same dialog and use its output via jQuery events (for example, a click on a div)?

Upvotes: 0

Views: 1192

Answers (2)

Arushi Agrawal
Arushi Agrawal

Reputation: 629

 $("#uploadFile").click(function (e) {
      $(this.find('input[type="file"]').click();
  });

where 'uploadFile' may be the div or button which you click and input[type="file"] is the asp.net file upload control whose visibility is set as false

Upvotes: 0

Alex K.
Alex K.

Reputation: 175766

It just invokes click on a hidden input;

<input id="fileSelector" type="file" style="visibility:hidden"/>
<div id="adiv">Click<div>

...

$(function() {
    $("#adiv").click(function() {
        $("#fileSelector").click();
    });
});

Upvotes: 1

Related Questions