服务器端文件浏览

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/", "");

    });    
  });