File dialogs – opening and saving files

Before talking about file dialogs, I have to do a little introduction. It is probably obvious, but while in the browser, file dialogs allow you to upload or download files, in NW.js, they do nothing but pass the path of the selected folder or files. So, any following operation will be done on the original file, not on a copy.

WebKit enables you to open file dialogs through the file input field but with many limitations due to security concerns. In NW.js, those limitations have been removed, and the default file input fields have been enhanced in order to give a full native user experience.

A faster way to open a file dialog is to add an event listener to the file input field as follows:

<input id="fileDialog" type="file">
<script>
document.querySelector('#fileDialog')
  .addEventListener("change", function() {
    var filePath = this.value;
    alert(filePath);
  });
</script>

In the preceding example, a default file input field will...