jquery – 设置自定义文件名datatables导出带有选择文本的excelHtml5

前端之家收集整理的这篇文章主要介绍了jquery – 设置自定义文件名datatables导出带有选择文本的excelHtml5前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我想知道如何设置一个自定义文件名导出数据表按钮excelHtml5与选择,我做了一个功能来传递名称,但没有设置它生病了我的js代码.警报它反映了变化,但当我调用数据表中的excel按钮时,它是空的.

这是代码

var reportName = '24 afterhours ';
$('#example').DataTable({
   dom: 'Bfrtip',buttons: [
      {
         extend: 'excelHtml5',title: reportName
      },{
         extend: 'pdfHtml5',title: 'Data export'
      }
  ]
});

$('#campaing').change(function() {
   reportName += $(this).find(":selected").text() + ' report';
});

我想我可能会遗漏一些东西.

解决方法

初始化dataTable时读取一次title,然后将值映射到内部配置对象.因此,如果要动态更改设置,则必须更改该内部配置对象,而不是尝试更改只读配置设置.

反之亦然 – 为< select>创建一个事件监听器.在按钮内部init()回调本身.如果您有< select>使用这样的可选文件

<select id="filename">
    <option value="filenameA">filename A</option>
    <option value="filenameB">filename B</option>
    <option value="filenameC">filename C</option>
</select>

然后,您可以动态更改导出文件名(==标题扩展名)

buttons : [
   {
    extend: 'excelHtml5',title: 'filenameA',//default filename
    init: function(dt,node,config) {
        $("#filename").on('change',function() {
            config.title = this.value;
        })
    }
},

您也可以在处理程序中更改其他配置属性,例如,您可能希望将config.extension更改为其他内容.

这是一个演示 – > https://jsfiddle.net/y8d9zhfv/
需要强调的是,dataTables.buttons.js需要1.3.0或更高版本; buttons.html5.js模块也是如此.所以,如果以上不起作用升级 – > https://cdn.datatables.net/buttons/

猜你在找的jQuery相关文章