Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Pure HTML export buttons in jQuery Data Table

I am using jQuery DataTables. It provides set of export buttons. But those buttons are swf buttons.

I would like to have HTML drop down buttons. I have gone through its help but could not found such code to set HTML5 buttons other than built in Flash.

I would like to have drop down buttons like below

Export
- PDF
- CSV
- HTML
- Excel

Above buttons are set of HTML tags (generally what they are in HTML). Can I do that?

Edit:

I would like to generate buttons using button, div, ul, li tags combination which we generally do in our regular HTML files.

like image 224
NullPointer Avatar asked Jan 08 '23 10:01

NullPointer


1 Answers

SOLUTION

Use the code below for HTML5 export buttons that don't use Flash.

var table = $('#example').DataTable({
    dom: 'Bfrtip',
    buttons: [
      {
         extend: 'collection',
         text: 'Export',
         buttons: [ 'pdfHtml5', 'csvHtml5', 'copyHtml5', 'excelHtml5' ]
      }
   ]
});

You need to use Download Builder to include DataTables, Buttons, HTML5 export, JSZip and pdfmake libraries to produce links to CDN for JS/CSS files.

DEMO

See this jsFiddle for code and demonstration.

LINKS

  • HTML5 export buttons
  • Button - collection
like image 124
Gyrocode.com Avatar answered Jan 28 '23 07:01

Gyrocode.com