简体   繁体   English

如何使用自定义文件列表(远程、服务器目录)在 SPA(浏览器端)上打开文件对话框

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

I have a MVC project with a view.我有一个带有视图的 MVC 项目。 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?有什么方法可以用我的 Javascript 文件列表填充打开文件对话框吗?

Regarding the buttons, you can take a look at bootstrap: https://getbootstrap.com/docs/4.0/components/list-group/关于按钮,你可以看看引导程序: 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:关于 JS 部分,您可以使用以下内容:

<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.希望能帮助到你。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM