DataTables PDF水平导出也带有CSV导出按钮

Question

我想将PDF导出更改为水平，但示例仅包含PDF导出按钮。虽然我有CSV和PDF按钮，但我想知道在哪里放置我的CSV按钮。

当前代码：

$('#sales').DataTable({
                dom: 'Bfrtip',
                buttons: [
                    'csvHtml5', 'pdfHtml5'
                ],
                "order": [[ 1, "desc" ]]
            });

我想申请：

$('#example').DataTable( {
        dom: 'Bfrtip',
        buttons: [
            {
                extend: 'pdfHtml5',
                orientation: 'landscape',
                pageSize: 'LEGAL'
            }
        ]
    } );

Answer 1

这里是一个工作解决方案的片段（文本是德语，删除或翻译成您的语言）。 它将添加4个按钮：

dom: 'Blfrtip',
        buttons: [
            {
                extend: 'colvis',
                titleAttr: 'Sichtbare Spalten auswählen (gilt auch für Export)',
                text: '<i class="fa fa-filter" aria-hidden="true"></i>'
            },
            {
                extend: 'csv',
                titleAttr: 'Tabelle als CSV exportieren',
                text: '<i class="fa fa-file-text-o" aria-hidden="true"></i>'
            },
            {
                extend: 'copyHtml5',
                titleAttr: 'Tabelle in Zwischenspeicher kopieren',
                text: '<i class="fa fa-clipboard" aria-hidden="true"></i>',
                exportOptions: {
                    columns: ':visible'
                }
            },
            {
                extend: 'excelHtml5',
                title: 'Filialübersicht',
                titleAttr: 'Tabelle als Exceltabelle exportieren',
                text: '<i class="fa fa-file-excel-o" aria-hidden="true"></i>',
                exportOptions: {
                    columns: ':visible'
                }
            },
            {
                extend: 'pdfHtml5',
                orientation: 'landscape',
                title: 'Filialübersicht',
                titleAttr: 'Tabelle als PDF exportieren',
                text: '<i class="fa fa-file-pdf-o" aria-hidden="true"></i>',
                exportOptions: {
                    columns: ':visible'
                }
            },
            {
                extend: 'help',
                titleAttr: 'Hilfe anzeigen',
                text: '<i class="fa fa-question-circle" style="color:#FF480D;" aria-hidden="true"></i>',
            }

最后一个按钮（帮助）是一个自定义按钮，打开一个带有一些帮助文本的模态窗口。