Jquery将表格导出到csv隐藏表格单元格

Posted 2023-03-05

【中文标题】Jquery将表格导出到csv隐藏表格单元格

【英文标题】：Jquery exporting table to csv hidden table cells

【发布时间】：2016-03-17 14:45:43

【问题描述】：

我需要能够将 html 表格导出为 CSV。我在某处找到了一个 sn-p；它有效，但不完全是我想要的。

在我的表中（在小提琴中）我有隐藏字段，我只是使用快速 n 脏内联样式和内联 onclicks 在你看到的内容之间进行交换。

我想要导出的是它选择当前显示的表格。所以只有 td's where style="display:table-cell"。我知道如何在普通的 JS 中做到这一点。

    document.querySelectorAll('td[style="display:table-cell"])');

但是如何使用我现在在 exportTableToCSV 函数中的代码来做到这一点？

（抱歉，小提琴中的文字是荷兰语，是现场版本的直接副本）。 小提琴： http://jsfiddle.net/5hfcjkdh/

【参考方案1】：

在您的grabRow 方法中，您可以使用jQuery's :visible selector 过滤掉隐藏的表格单元格。下面是一个例子

function grabRow(i, row) 

    var $row = $(row);
    //for some reason $cols = $row.find('td') || $row.find('th') won't work...
    //Added :visisble to ignore hidden ones
    var $cols = $row.find('td:visible'); 
    if (!$cols.length) $cols = $row.find('th:visible');

    return $cols.map(grabCol)
                            .get().join(tmpColDelim);

【参考方案2】：

这就是我解决它的方法。决定放弃纯 javascript 解决方案，以减轻客户端的处理压力，转而在服务器端处理。

因为我已经使用存储过程从数据库中获取数据，所以我使用它来再次获取数据集并将其转换为 ViewExportModel，因此我有一个 TotalViewExport 和一些基于选定的变量我填充了不同的模型。

添加到现有的显示功能以更新选定变量以跟踪当前选定的视图。

当用户点击导出表格到 excel 时，它会调用当前页面的控制器 IE。 AlarmReport (so AlarmReportController) 和我创建了动作 ExportReports(int?SelectedView);

此外，我添加了CsvExport 作为经理。这需要数据结果（因此 c# 模型/ iqueryables/ 列表/ 等）。并将它们放入 Csv 集中。使用返回类型 BinaryContent 可以导出包含此数据的 .csv 文件。

ExportReports 操作使用 selectedview 参数调用存储过程。结果被泵入正确的模型。这个模型作为行被注入到 CsvExport 模型中。

文件名是根据选择的视图+选择的对象+当前日期（yyyy-MM-dd）。例如“Total_Dolfinarium_2016-05-13”。让

最后，该操作使用 CsvExport 中的 BinaryContent Returntype 和 ExportToBytes 将 .csv 文件作为下载返回

这个动作的导出部分是这样编程的（缩短了一些检查，比如选择了多个对象等）（预先收集了数据和对象名）：

public ActionResult ExportCsv(CsvExport Data, string ObjectName, string Type)
   var FileName = Type + "_" + ObjectName + "_" + DateTime.Now.ToString("yyyy/MM/dd");
    return BinaryContent("text/csv", FileName + ".csv", Data.ExportToBytes());