open the file upload dialogue box onclick the image

21

I want to open the image upload file dialogue box if i click the button tag.is it possible.if so how can i do it in php

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

This question is tagged with javascript php html

~ Asked on 2014-03-10 05:01:36

The Best Answer is


67

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

The code will look like:

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

And on the button's click event write the jQuery code like :

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

This will open File Upload Dialog box on your button click event..

~ Answered on 2014-03-10 05:28:59


11

you need to add a little hack to achieve this.

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

and onclick of your button you can trigger your file upload click.

It will open a file upload window on click of button

<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 a fiddle for this example: http://jsfiddle.net/ravi441988/QmyHV/1/embedded/result/

~ Answered on 2014-03-10 05:12:05


Most Viewed Questions: