Trigger the click event of anchor having the download attribute

Question

I'm trying to trigger the click event of an anchor tag with it having the "download" attribute to force the download of the file with a specific name.

How it work is the user clicks a button that will extract data from a table and the php will create the file and send back the url to it. The file itself as a randomly generated name so that's where the download attribute of the anchor comes handy as I can specify the name of the file I want the user to see.

What I'm doing is something like this (simplified)

PHP:

$content = $_POST['content'];

$url = "temp/extraction/" . getRandomString();
$fileName = $_SERVER['DOCUMENT_ROOT'] . "/the_page/" . $url;

$file = fopen($fileName, "w");
fputcsv($file, $content);
fclose($file);

echo $url;

My success function of the ajax in Javascript with Jquery:

function(url){
    //edited
    var a = $('<a href="'+url+'" download="extraction.csv"></a>');
    $('body').append(a);
    a.click();     
 }

So if I click it manually it works perfectly, but I don't want the anchor to be visible (so it's not supposed to be clickable) and it's only there temporarily to trigger the download.

So is there a way to perfectly simulate the click event of the anchor? I did not find anything that would trigger the download and not opening a new page and use the name of the file I want.

I know that the download attribute of the anchor is not fully supported by old browsers but it doesn't matter for my user base as it is for my colleagues and boss and everyone is using the latest FF.

you're click()ing the body tag. make the in a separate var so you can both append() it to body and click() it. — dandavis, Jul 25 '14 at 15:55
I don't think the click was on the body, it was inside the parenthesis of the append function and the click it was on the jquery object of the tag. Anyway I suspected maybe that the click was done before the append and could cause it to not trigger and edited the code. Still doesn't work. — Mick412, Jul 25 '14 at 15:59
Are you just wanting to do a download on the page, without the link altogether? I can give you a more robust solution then using the link. — ArtisticPhoenix, Jul 25 '14 at 16:00
ahh. makes sense; maybe i mis-read it... you can see how i did it in the very middle of the code at http://danml.com/js/download.js ; you might need to wait in a timeout before you click() it. — dandavis, Jul 25 '14 at 16:02
I want to do a download on the page yes, popup asking to open or save the file. The link doesn't have to be there but I would like to be able to trigger a download of a file on the server and change the name of the file that the user downloads on the client side. The anchor and "download" attribute does that for me. — Mick412, Jul 25 '14 at 16:07
Yes, javascript sends table information on to php, php creates file and return the url, trigger a click to open open/save popup with specific name exemple url: temp/extraction/pOtUMq, save as shows:extraction.csv — Mick412, Jul 25 '14 at 16:12
Triggering the native `click` event of an `` element with jQuery `.click()` doesn't work. Use `a[0].click();` — Ian, Jul 25 '14 at 16:12
Thanks Ian! That worked! Strange though I didn't know that. You can submit answer if you want some upvotes — Mick412, Jul 25 '14 at 16:14
@ArtisiticPhoenix "I know that the download attribute of the anchor is not fully supported by old browsers but it doesn't matter for my user base as it is for my colleagues and boss and everyone is using the latest FF." - from the OP...otherwise, good point. — Ian, Jul 25 '14 at 16:16

Trigger the click event of anchor having the download attribute

0 Answers0