Disable download link while downloading is done

Navigation
-1

How to implement this functionality?

When the user presses the Download link he will receive a download confirmation message and where he wants to save the file.

This download takes an average of 30s (you can get up to more depending on the date required).

I wanted to disable this link during the time the download is done and return to normal when the download is complete.

Is there an event to capture the beginning and the end of the download?

Update

My question needed two answers to be complete. @LeAndrade replied to a part of it (like disabling the <a> link. I'll post here as I did to capture the end of the download.

  • In the backend (in my case php) create a function to send a cookie when the file is available in the Browser for download. Note that we can not know if the user will accept the download or not. Here is the code setcookie("statusDownloading", "done", time() + (300), "/");

  • On the front end when the user clicks on the link, the link is disabled (or removed) and starts a loop that looks for the cookie sent by php, in this case statusDownloading . When the cookie is found, the link is reestablished, the cookie is deleted, and the loop is stopped. 

    function removeLink () {
    let htmlObj=$('#LinkDownload');

    htmlObj.detach();

    setTimeout(function(){
        let condition=true;
        while (condition) {
            let theCookies = document.cookie.split(';');
            for (let i = 1 ; i <= theCookies.length; i++) {
                let str = theCookies[i-1];
                let cookie=str.split("=");
                let cookieName = cookie[0];
                if(cookieName.trim() == 'statusDownloading'){

                    htmlObj.appendTo('#parentOfLinkDownload');

                    document.cookie = 'statusDownloading=; path=/; expires=Thu, 01 Jan 1970 00:00:01 GMT;';
                    condition=false;
                    break;
                }
            }
        }
    }, 1000);
}
    • asked by anonymous 10.10.2018 / 16:09

    1 answer

    1

    Yes this is perfectly possible, notice my example code. I made a function in Javascript that when clicking the link a , it 'loses' the attribute href and after the count that in your case would be the download, it again has the href, more explanations in the code: 

    var a = document.getElementsByTagName('a')[0];  // pega a tag a

a.onclick = function() {                        // no clique do a
  a.attributes.removeNamedItem("href");         // removo o atributo href
  
  setTimeout(function() {                       // depois de 2 segundos
    var b = document.createAttribute("href");   // crio o atributo href de novo
    b.value = "#";                              // atribuo um link para ele
    a.setAttributeNode(b);                      // e seto o novo atributo no a
    console.log('Download concluído!');
  }, 2000);
  
}
    <a href="#">Clique aqui</a>
      

    Remembering that there is no specific method in javascript to capture the beginning and end of a download!

        
    10.10.2018 / 20:58
    The code does not respect ifs Use of EOF in vectors