javascript : download file from server : open file dialog to choose folder to save file

Question

Want to download a file , the "save folder dialog' should pop up to chose the folder where to save the file.

I tried with window.location, window.location.assign, widow.open functions. Everything leads to opening a fresh page! and cant see any "save folder dialog" popped up!

downloading file name is with extension .cfg, the file can be either binary or Json(text file). Will there be any difference if the file being binary or text?

$( document ).ready(function() {

  $("#DownloadFile").click(function() {
    // // hope the server sets Content-Disposition: attachment!
    var  urlData= window.location.protocol + "//" +       window.location.host + "/" + "download/testdown.cfg";
    alert("download file: " + urlData);
    retval = fileExists(urlData);
    if(retval) {
      alert("file exists !!");
      window.location = 'download/testdown.cfg';
      // window.location.assign(urlData);
      // window.open(urlData, 'Download');  

    }else{
      alert("File not exists !");
    }
  });





  function fileExists(url) {
    alert(" url : " + url);
    if(url){
      alert(" url : " + url);
      var req = new XMLHttpRequest();
      req.open('HEAD', url, false);
      req.send();
      // return req.status==200;
      return true;
    } else {
      return false;
    }
  }

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="table table-condensed table-bordered table-striped volumes tabcenter" 
       style="align:center; margin:5px; width:98%">

  <tbody>
    <tr>
      <td>
        <div class="row">
          <h1>Choose File Type</h1>
          <label class="radio-inline">
            <input name="radioGroup" id="radio1" value="option1" type="radio"> Binary Data
          </label>
          <label class="radio-inline">
            <input name="radioGroup" id="radio2" value="option2" checked="" type="radio"> Json Data
          </label>

        </div>  
      </td>

      <td > 
        <button type="submit" id="DownloadFile" >Download!</button>
      </td>
    </tr>
  </tbody>
</table>

https://www.w3.org/Protocols/rfc2616/rfc2616-sec19.html#sec19.5.1 — epascarello, Aug 12 '16 at 13:23

score 1 · Answer 1 · edited May 23 '17 at 12:14

1

For security reasons JavaScript in browser are not allowed to have access to user computer. So you just need to make ways in standard way. Button sends request to server and it return correct headers which will save file in special directory. Also read this answer.

How can I read the client's machine/computer name from the browser?

javascript : download file from server : open file dialog to choose folder to save file

1 Answers1