Open a PDF from Edge without opening redundant bla

问题:

The page I'm working on lists documents. Each document is a clickable link. Clicking opens a PDF (which typically opens in a different tab, or even a different application, depending on the user's settings), then reloads the original tab so that an "unread" count on the page is updated and the link style is changed to indicate "read".

HTML span surrounding the document details:

<span class='btn-link' onclick='openReport(@orderNumber, @tableBodyId); return false;'>

Javascript:

function openReport(orderNumber, tableBodyId) {
    var url = "/Reports/ValuationReportDocPdf?orderNumber=" + orderNumber;
    var win = window.open(url, '');
    setTimeout(function () { location.reload(); }, 3000);
}

The Javascript works as intended in Chrome, Firefox and IE11.

In Edge, when the link is clicked, a blank tab is opened and receives focus while the original tab is blinking on the tab bar, waiting for me to choose between "Save", "Save As" and "Cancel". So the user must go back to the original tab to proceed. That's quite a messy user experience to start with. Then, if I click "Save", it gets worse: a third tab is opened containing the PDF.

Question

How do I get Edge to play nicely? I want focus to stay on the original page until the user has chosen what to do with the PDF, then open the PDF without opening any empty tabs.

Edit

This post seems related, but it uses an <a>. I don't think I can use an anchor because I need to also refresh the page.

回答1:

I found some help with this one. For Edge only, I dynamically create an <a> with a download attribute, and "click" it.

function openReport(orderNumber, tableBodyId) {
    var url = "/Reports/ValuationReportDocPdf?orderNumber=" + orderNumber;

    if (isEDGE()) {
        var dl = document.createElement('a');
        dl.setAttribute('href', url);
        dl.setAttribute('download', 'filename.txt');
        dl.click();
    } else {
        window.open(url, '');
    }

    setTimeout(function () { location.reload(); }, 3000);
}

function isEDGE() {
    return /Edge\/\d./i.test(navigator.userAgent);
}