3

I have used the download attribute of a link to download a file. However, when I trigger the click event from another method, it doesn't download the file. Why is that so? I have checked that the click event is being triggered. Here's my test on jsfiddle - http://jsfiddle.net/6Fkb5/1/

<a href="#" download="https://www.dropbox.com/s/shd31hvnsn0fd0v/Getting%20Started.pdf" id="testdownload">Test Download</a>

var count=0;
$('#testdownload').on('click', function(){
    count++;
    $('#log').append('<li>Click triggered ' + count + ' times</li>');
});


$('#testdownload').trigger('click');
Madhu
  • 1,019
  • 4
  • 10
  • 24
  • @rakhi4110 is it when you run it or when the link is clicked? – Madhu Mar 02 '14 at 08:40
  • I think you misuse the `download` attribute. It is to specify a different filename for the download link specified in the `href` attribute. It won't solve your problem, but maybe you should fix it nonetheless. – GolezTrol Mar 02 '14 at 08:44
  • duplicate of http://stackoverflow.com/questions/6796974/force-download-an-image-using-javascript – Pascal Le Merrer Mar 02 '14 at 08:46

2 Answers2

9

Try this instead:

$('#testdownload').get(0).click();

Edit: Just to clarify this will trigger a native click event instead of jQuery's.

Ruben
  • 5,043
  • 2
  • 25
  • 49
  • Not really. It just doesn't want you to open a PDF in a fiddle frame. Check this: http://jsfiddle.net/6Fkb5/10/ – GolezTrol Mar 02 '14 at 08:51
  • Sorry didn't try it in IE, but works fine in Chrome, so not sure why it got downvoted. – Ruben Mar 02 '14 at 08:52
  • get(0) returns the domelement, which is what you would get if you would do document.getElementById('testdownload'). A jQuery selector wraps this domelement in its own object with its own methods. – Ruben Mar 16 '14 at 17:23
1

Will not work....

even if you delay it and wait for DOM ready:

var count=0;

$(function(){
  $('#testdownload').click(function(){
     count++;
     $('#log').append('<li>Click triggered ' + count + ' times</li>');  
  });

setTimeout(function(){ $('#testdownload').trigger('click'); },3000);

});

The reason is SECURITY protocols... browsers will not allow scripts to trigger a download request only by user click.

EDIT:

actually CHROME will support $('#testdownload').get(0).click(); but IE will block your script.

The correct way to trigger a download (will work in most browsers except IE) is to use an iframe:

<iframe width="1px" height="1px" frameborder="0" src="{File location}"></iframe>
Shlomi Hassid
  • 6,500
  • 3
  • 27
  • 48
  • How do those other pages work, which do start downloads after a couple of seconds? And why does Ruben's answer work? Apparently this answer is wrong. – GolezTrol Mar 02 '14 at 08:45
  • 1
    Server side deals with it, forcing the download response. – Ryan McDonough Mar 02 '14 at 08:47
  • IE blocks it in the fiddle, because it tries to open it in a frame. Also, it tries to open the PDF rather than download it. It does work, though, if you add `target="_blank"`. No security issues, just IE being a bit quirky and trying to open the file. http://jsfiddle.net/6Fkb5/10/ – GolezTrol Mar 02 '14 at 08:50