将 HTML 表转换为 JSON 以传递给 AJAX 调用以下载为 CSV

Question

我必须在 ASP 经典中编写一个报告系统。 编写线框图的人对性能/速度/SQL 的工作原理等没有概念，所以我从数据库中获取数据很有趣。

但他们希望用户可以按下按钮将报告“下载”到 CSV 文件。

我可以提交表单并重新运行 SQL（由于一页上显示的报告数量及其格式，这需要很长时间） - 然后将其作为文件发送到浏览器。

或者我正在考虑使用 JS 或 jQuery 等获取所需的目录，以某种方式将其转换为 JSON 对象，使用 AJAX 将其发布到另一个页面，然后在另一个页面中获取 JSON 并将其解码为CSV 格式，然后可以作为文件传递给用户。

我只是认为这种 JS 方法会更快，而且如果我可以使其通用，那么它可以采用任何带有类的表，例如“report”并将其转换为用于创建 CSV 的 JSON 对象我可以轻松地在他们让我编写的数百份报告中重复使用此代码。

有没有人有一个 JavsaScript 代码或 jQuery 可以获取任何格式的表格（它有一个带有列标题的thead，带有主要内容的 tbody）并将其编码为 JSON 或 JS 对象以发布到另一个页面然后我可以在哪里对其进行解码并将其作为 CSV 文件输出？

这是他们的一份报告的屏幕截图，

Answer 1

该问题的一个可能解决方案是在请求显示给定报告的页面时已经为每个报告生成数据的 CSV 格式版本。 （每个报告仅查询数据库一次。）以预期格式将数据发送回响应中，以将其显示在表中并将 CSV 文件保存到服务器上的临时位置。

这样，您可以在“下载 CSV”表附近放置一个链接，该链接将指向已存在的文件。它将避免必须为一份报告查询相同的数据两次，或者必须将相同的数据发送到服务器和客户端之间的往返。

Answer 2

Javascript 不提供将文本保存到文件的方法，因此您仍然必须在服务器端执行该操作，即按照您的建议通过 AJAX。

使用 jQuery，您可以执行类似的操作（未经测试），然后通过 AJAX 请求发送。

var headers = [];
$('table.report thead > tr > th').each(function($i, obj) { //or <td> instead of <th>
    headers.push($(obj).text());
});

var data = [];
$('table.report tbody > tr').each(function($i, tr) {
    var row = [];
    $(tr).find('th').each(function($h, td) {
        row[headers[$h]] = td.text();
    });

    data.push(row);
});

var json = JSON.stringify(data);

但是我认为这不是更好的方式，因为它仍然是用户输入。我可以在 POST 中放入一些随机数据并获得 CSV 作为回报。

更好的方法是缓存您已有的数据，并在请求时从缓存的数据创建一个 CSV 文件。