Clever Geek Handbook

Image onclick download image javascript / jquery

I want to save the image when you click the same one in the example below.

http://www.thrombosisadviser.com/en/resources/image-library/index.php

After clicking the small image, a popup will appear with the download button, clicking the download button, the image will be loaded and ready to save.

I want to do the same in javascript / JQuery only. Please help and suggest.

As always, thanks to everyone in advance.

+2


source to share


2 answers


Can't load and save image with javascript only, you will need server side scripts as well. From javascript you can only initiate a request and it is a server side script that produces the expected result. So in order to load the image you can initiate an ajax request with javascript and on the server side script you have set the HTTP header as shown below which will initiate the download dialog in the browser

Content-Disposition: attachment; file name = "image.jpg";



Or else, you will receive it as a binary response from the server. Which again you need to use javascript to write it as a file on the client machine, which is not possible as it is a security violation to write the file via javascript.

Hope this helps you

+2


source


For each image on the screen, create a hidden item div

that has a large version of the image and a download button. When the corresponding image is clicked, show the correct hidden div.

Working demo: http://jsfiddle.net/K3Jkf/2/



It's best to do this type with ajax (standalone PHP page), but as you said, you prefer not to.

-1


source






More articles:


All Articles