Make anchor link download a file

Question

I have written below lines of code.

for (var counterOfCerticateLoop in certificateDetailsArray) {
    var document_type_id = certificateDetailsArray[counterOfCerticateLoop]['document_type_id'];
    var document_actual_name = certificateDetailsArray[counterOfCerticateLoop]['document_actual_name'];
    var document_unique_name = certificateDetailsArray[counterOfCerticateLoop]['document_unique_name'];
    var document_type = certificateDetailsArray[counterOfCerticateLoop]['document_type'];
    var document_description = certificateDetailsArray[counterOfCerticateLoop]['document_description'];

    var fileURL = '../student/certificates/' + document_unique_name;

    var EditButton = '<button title="Edit" onclick="editContactDetail(\'' + document_type_id + '\')" class="btn btn-primary table_btn btn-outline btn-sm"><i class="fa fa-pencil"></i></button>';

    var DeleteButton = '<button title="Delete" onclick="deleteContactDetail(\'' + document_type_id + '\')" class="btn btn-danger  table_btn btn-outline btn-sm"><i class="fa fa-trash"></i></button>';

    var tableRow = '<tr><td>' + document_type + '</td>' +
        '<td><a href=' + fileURL + '>' + document_actual_name + '</a></td>' +
        '<td>' + document_description + '</td>' +
        '<td>' + EditButton + DeleteButton + '</td>';
    $("#certificateTable").append(tableRow);
}

The above code creates table perfectly. Now the issue is that we click on file link, it does not get downloaded. I want that it should download the file in fileURL which is rendered in anchor tag's href attribute.

Please help !!!

it is redirected in another tab of browser where it's content is displayed — Nida Amin, Mar 27 '18 at 10:39

4b0 · Answer 1 · 2018-03-27T10:44:55.700

1

Use HTML5 download attribute.

<a download href=' + fileURL + '>' + document_actual_name + '</a>

Note: Be aware may be all version of different browser not supported this attribute

edited Mar 27 '18 at 10:44

answered Mar 27 '18 at 10:41

4b0

21,981
30
95
142

SRK · Answer 2 · 2018-03-27T10:48:18.557

0

You can put this code in your .htaccess file and try if it works?

AddType application/octet-stream .csv
AddType application/octet-stream .xls
AddType application/octet-stream .doc
AddType application/octet-stream .avi
AddType application/octet-stream .mpg
AddType application/octet-stream .mov
AddType application/octet-stream .pdf

edited Mar 27 '18 at 10:48

answered Mar 27 '18 at 10:32

SRK

3,476
1
9
23

Sorry it is not getting downloaded – Nida Amin Mar 27 '18 at 10:34
What happen when you click on a tag? @NidaAmin – SRK Mar 27 '18 at 10:38
it is redirected in another tab of browser where it's content is displaye – Nida Amin Mar 27 '18 at 10:39
`var fileURL = 'www.example.com/student/...` - that is still a relative URL, so unless you had a folder named `www.example.com` in the root of your site, this is of course still nonsense. It would need to be at least `var fileURL = '//www.example.com/student/...` – CBroe Mar 27 '18 at 10:46
I have updated my answer. @CBroe – SRK Mar 27 '18 at 10:48

Make anchor link download a file

2 Answers2