Open the onclick the image file download dialog

Question

I want to open a dialog box with an image upload file if I click the tag.is button it is possible. So how can I do this in php

while{ echo "<td><button><img src='".$cfet['productimage']."' width='50' height='40'></button></td>"; } 

Answer 1

Include the input element type="file" on your HTML page and in the click event of your button, display the click event of the input type element using the jQuery trigger function

The code will look like this:

 <input type="file" id="imgupload" style="display:none"/> <button id="OpenImgUpload">Image Upload</button> 

And in a button click event write jQuery code, for example:

 $('#OpenImgUpload').click(function(){ $('#imgupload').trigger('click'); }); 

The File Download dialog box appears at the click event.

Answer 2

you need to add a little hack to achieve this.

You can hide the file upload ( input type=file ) behind the button .

and by clicking the button, you can start the file download.

It will open the file download window when you click

 <button id="btnfile"> <img src='".$cfet['productimage']."' width='50' height='40'> </button> <div class="wrapper"> //set wrapper `display:hidden` <input type="file" id="uploadfile" /> </div> 

and some javascript

 $("#btnfile").click(function () { $("#uploadfile").click(); }); 

here is the script for this example: http://jsfiddle.net/ravi441988/QmyHV/1/embedded/result/

Answer 3

In addition, you can write everything inline, directly in the html code:

 <input type="file" id="imgupload"> <a href="#" onclick="$('#imgupload').trigger('click'); return false;">Upload file</a> 

return false; - It will be useful to reject the binding action after clicking the link.

Answer 4

  <label for="profileImage"> <a style="cursor: pointer;"><em class="fa fa-upload"></em> Change Profile Image</a></label> <input type="file" name="profileImage" id="profileImage" style="display: none;">