如何从一个文件夹的动态csv文件创建HTML数据表

我想知道如何从多个CSV文件创建HTML数据表。如何从一个文件夹的动态csv文件创建HTML数据表

例如，我有一个文件夹，其中包含名为"Data_Source1-Memory.csv", "Data_Source1-CPU.csv", Data_Source1-Disk.csv", Data_Source2-Memory.csv" and "Data_Source2-CPU.csv"的CSV文件。

这些文件是根据“Data_Source1”或“Data_Source2”动态创建的。所以，每次它不一定有内存或CPU或磁盘CSV文件。

有没有一种方法可以循环访问“Data_Source1”的这些csv文件并将它们呈现在HTML表格（one table for Memory, one table for Disk and one table for CPU）中。然后循环访问“Data_Source2”文件夹，并将这些CSV作为HTML表格呈现。

到目前为止，我所能找到的是jQuery plugins，只要我可以测试只适用于静态csv文件或数据（如DataTables）。

我也知道存在什么文件，所以我不必搜索以查看是否有文件，我知道我需要哪些文件。我只是不知道如何循环访问不同的csv文件来为每个csv文件生成一个表。

任何帮助或建议将不胜感激。

来源

2016-02-11 Catherine

你不能这样做，因为JavaScript本身不能获取文件夹中文件的列表。您需要运行某个服务器，该服务器根据请求构建此HTML页面或至少提供文件夹内容 – smnbbrv

[可以获取目录中所有文件夹的列表]（http://stackoverflow.com/questions/15537424/get -a-list-of-all-folders-in-directory） – smnbbrv

@smnbbrv我可以访问Data_Sources中每个相关标题（即内存，CPU，磁盘）的列表。所以我知道哪些文件存在或不存在，如果有帮助 – Catherine

只要服务器目录启用了目录列表，并且从域内运行脚本，那么通过收集某个目录中的某些文件列表就不会有问题。只需使用$.ajax并从检索的目录列表HTML页面中解析文件名即可。下面的工作在一个标准的Apache：

var fileMask = '-CPU', //signature of the files 
    fileExt = 'csv'; //file extension 
$.ajax({ 
    url: 'path/to/directory/', 
    success: function (data) { 
     var file, files = []; 
     $('a[href]', data).each(function(i, a) { 
      file = $(a).attr('href'); 
      if (~file.indexOf(fileMask) && file.match(/[^.]+$/) == fileExt) { 
       files.push(file); 
      } 
     }) 
    } 
})

结果是一个包含

['Data_Source1-CPU.csv', 'Data_Source2-CPU.csv', 'Data_Source3-CPU.csv']

您可以使用files.sort()如果你想要的文件列表是按数字顺序一个files阵列。现在它应该是一个nobrainer使用files作为自动创建的数据表的基础 - 见Create dataTable column definition from uploaded csv data - 周期通过files并插入数据从每个CSV而不是单个文件中的答案。

来源

2016-02-11 13:49:32 davidkonrad

如何从一个文件夹的动态csv文件创建HTML数据表

回答

相关问题