Question

我正在开发一个Web应用程序，它从一组文本文件中读取数据并将其映射到MySQL数据库。

目前，该表单需要手动输入文件路径，但我想在此字段中添加一个文件选择器，以使设置的这一部分不那么繁琐。

我发现的解决方案都允许选择单个文件，但我正在寻找允许使用输入模式的解决方案，因为我们的大部分工作都要求我们一次性从服务器上取出多个文件

非常感谢任何有关此事的帮助。

Answer 1

我花了很多时间进行搜索和解决，但我找到了一个合理可行的答案。

我遇到的最大问题是浏览服务器端文件。我在A Beautiful Site找到了一个解决了这个问题的jQuery插件。

这是一个AJAX文件浏览器，带有用于JSP，PHP，ASP等的服务器端连接器脚本。

我使用以下脚本构建了webapp的文件树：

  $(document).ready( function() {
    $('#loadFolderTree').fileTree({

        root: '/server_root/subfolder/tree_root',
        script: '/js/jquery_file_tree/connectors/jqueryFileTree.jsp',
        multiFolder: false,

    });    
  });

这个脚本的好处是它将选定的文件路径作为String返回。通过对脚本的默认文件处理进行一些小的添加，我能够使用以下代码将返回的文件路径写入相应的表单字段：

}, function(file) {
            var loadPat = document.getElementById("loadPattern");
            loadPat.value = file.replace("/server_root/subfolder/tree_root/", "");

由于表单已经构建为处理相对于根的文件，因此无需打印整个路径，因此最后一段代码会修剪到根目录的路径，并将表单值设置为字符串的剩余内容。

最重要的是，返回的字符串是可编辑的，允许用户将input-file-1.txt的返回值更改为input-file * .txt，并在一次运行中导入多个文件。

这是最终结果：

  $(document).ready( function() {
    $('#loadFolderTree').fileTree({

        root: '/server_root/subfolder/tree_root',
        script: '/js/jquery_file_tree/connectors/jqueryFileTree.jsp',
        multiFolder: false,

    }, function(file) {
        var loadPat = document.getElementById("loadPattern");
        loadPat.value = file.replace("/server_root/subfolder/tree_root/", "");

    });    
  });

服务器端文件浏览

1 个答案: