How to Open File Dialog box on SPA (browser side) with custom file list (of remote, server directory)

Question

I have a MVC project with a view. Have a directory on server with files, and have to show good looking Open File dialog box with this directory and files in it (not a user's local directory). I got a list of files, and path, and send as variables (string and array of strings) into my view, so now I can show directory listing on my page. But I'd like to use some standard looking dialog box for choosing file instead of writing my own window with radio buttons and text boxes. Is there any way to fill Open file dialog box with my list of files With Javascript?

Answer 1

Regarding the buttons, you can take a look at bootstrap: https://getbootstrap.com/docs/4.0/components/list-group/

There you can use predefined buttons, lists etc. But specifically for downloading files there is no SPECIAL button of any kind.

Regarding the JS part, you can use something like:

<a id="download_link" download=filename.txt" href=”” onclick="getFile('someinputtxt')"><font size="5">Download Txt File</font></a>

<script> 
    function getFile(input)
    { 
    var text =  input;
    var data = new Blob([text], {type: 'text/plain'});
var url = window.URL.createObjectURL(data);

document.getElementById('download_link').href = url;
} 
</script>

There I create a text file with some input. But basically you can use a button/list that is already in bootstrap for example and just add the file using 'download':

Hope it helps.