I am implementing export buttons on jQuery DataTables using the Buttons extension. I have all the buttons working except for the export to Excel button.
All the below scripts are included:
<script src="bower_components/jquery/dist/jquery.js"></script>
<script src="bower_components/datatables/media/js/jquery.dataTables.js"></script>
<script src="bower_components/datatables/media/js/dataTables.bootstrap.js"></script>
<script src="bower_components/datatables-buttons/js/dataTables.buttons.js"></script>
<script src="bower_components/datatables-buttons/js/buttons.html5.js"></script>
<script src="bower_components/datatables-buttons/js/buttons.print.js"></script>
<script src="bower_components/datatables-buttons/js/buttons.bootstrap.js"></script>
<script src="bower_components/jszip/dist/jszip.js"></script>
<script src="bower_components/pdfmake/build/pdfmake.js"></script>
<script src="bower_components/pdfmake/build/vfs_fonts.js"></script>
Then I create the buttons and append them to a div:
// Create and render buttons
new $.fn.dataTable.Buttons( table, {
buttons: ['copyHtml5', 'csvHtml5', 'excelHtml5', 'pdfHtml5', 'print']
})
table.buttons().container().appendTo($('.header-right'), self);
When clicking on the Excel button, my app downloads a xlsx.zip file. Why is it not downloading a ".xlsx" file?
I've also tried to extend the button by manually adding the extension but whatever I set to the extension property ends up as "extension-name.zip".
new $.fn.dataTable.Buttons( table, {
buttons: [
{
extend: 'excelHtml5',
extension: '.xlsx'
}
]
})
Setting the Title property worked for me.
The following exported with the .xlsx file extension
buttons: [{
extend: 'excelHtml5',
title: 'Location Report'
}
],.....etc
When the title was not set, the file exported with the .zip file extension
buttons: [{
extend: 'excelHtml5',
title: ''
}
],.....etc
I also had same problem....but i think it is related to browser.
I also had same issue. Working perfectly with the chrome but not with the Mozila Firefox.....
Finally after so much efforts and research. i found the solution.
Please include below file in your script after datatable js file. //cdn.datatables.net/buttons/1.1.2/js/buttons.html5.min.js
It's working with me.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With