英文:
While exporting CSV Datatable. I'm not getting multiple headers. I'm getting only 2nd row of thead in JavaScript
问题
以下是您要翻译的内容：
我正在使用jQuery Datatables。我尝试导出CSV Datatable的多个标题行，但未成功。它只导出第二个标题行。我正在使用按钮：
buttons: [{
extend: 'CSV',
header: true
}, {
extend: 'print',
header: true
}],
我的表格结构如下：
<table id="example" style="color: black;" class="display compact cell-border" cellspacing="0">
<thead>
<tr>
<th rowspan="2">Sl.No</th>
<th rowspan="2">Zone</th>
<th colspan="2">Allotted</th>
<th colspan="2">Vacant</th>
<th colspan="2">Amenities</th>
<th colspan="2">Total</th>
</tr>
<tr>
<th>No Of Plots</th>
<th>Area</th>
<th>No Of Plots</th>
<th>Area</th>
<th>No Of Plots</th>
<th>Area</th>
<th>No Of Plots</th>
<th>Area</th>
</tr>
</thead>
</table>
英文:
Hi I am using jQuery Datatables. I am trying to export CSV Datatable multiple header rows but not getting. But it is Exporting only second header row. I am using Buttons:
buttons: [{
extend: 'CSV',
header: true
}, {
extend: 'print',
header: true
}],
My table structure like this
<table id="example" style="color: black;" class="display compact cell-border" cellspacing="0">
<thead>
<tr>
<th rowspan="2">Sl.No</th>
<th rowspan="2">Zone</th>
<th colspan="2">Allotted</th>
<th colspan="2">Vacant</th>
<th colspan="2">Amenities</th>
<th colspan="2">Total</th>
</tr>
<tr>
<th>No Of Plots</th>
<th>Area</th>
<th>No Of Plots</th>
<th>Area</th>
<th>No Of Plots</th>
<th>Area</th>
<th>No Of Plots</th>
<th>Area</th>
</tr>
</thead>
</table>
答案1
得分: 1
以下是要翻译的内容：
最简单的方法是编写一个硬编码的CSV字符串，表示第一个标题行 - 所以在您的情况下：
"","","Allotted","","Vacant","","Amenities","","Total",""\r\n
注意末尾的回车符和换行符 \r\n。
您可以在JavaScript字符串中使用这个字符串，并在主要的CSV导出数据之前添加它，使用一个 customize 函数：
$(document).ready(function() {
$('#example').DataTable( {
dom: 'Bfrtip',
buttons: [{
extend: 'csvHtml5',
header: true,
customize: function ( csvData, btn, tbl ) {
let firstHeader = '"","","Allotted","","Vacant","","Amenities","","Total",""\r\n'
return firstHeader + csvData;
}
}
}],
} );
} );
警告：
然而，我必须说，在CSV文本文件中有两个标题记录通常不是一个好主意（在我看来）。如果您想要自动处理这个CSV文件，那么有2个标题行将需要一些额外的工作。
另外，如果有人想在Excel中打开CSV文件，他们将看不到您在HTML表中的合并单元格 - 因为CSV文件只是一个文本文件，没有合并单元格或跨列的概念。
附加说明：
确保您正在使用DataTables的最新版本 - 支持 csvHtml5 的版本。
如果您还没有，您也可以从DataTables的下载页面获取相关的最新Buttons库。
英文:
The simplest approach is to write a hard-coded CSV string, representing that first header row - so in your case:
"","","Allotted","","Vacant","","Amenities","","Total",""\r\n
Note the carriage return and linefeed at the end \r\n.
You can use this in a JavaScript string and prepend it to the main CSV export data, using a customize function:
$(document).ready(function() {
$('#example').DataTable( {
dom: 'Bfrtip',
buttons: [{
extend: 'csvHtml5',
header: true,
customize: function ( csvData, btn, tbl ) {
let firstHeader = '"","","Allotted","","Vacant","","Amenities","","Total",""\r\n'
return firstHeader + csvData;
}
}
}],
} );
} );
Warning:
However I have to say, having two header records in a CSV text file is generally not a good idea (in my opinion). If you want to process this CSV file automatically, having 2 header rows is going to require some extra work.
Also, if someone wants to open the CSV file in Excel, they are not going to see the merged cells you have in the HTML table - because a CSV file is just a text file and it has no concept of merged cells, or colspans.
Additional notes:
Make sure you are using an up-to-date version of DataTables - one which supports csvHtml5.
You can also get the relevant up-to-date Buttons library from the DataTables downloads page, if you don't already have it.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论