How can i print multiple datatables in one single document

alxsan

Hi, i've been searching for a "simple" solution to this action, but i have bad look so far. I know it is in forum some cases showing how can you do this, but im still having some doubts. So, what im trying to do is take N (in this case 3) number of tables, apply them datatable and once is all ready, the user has the opportunity to print each single table or print all tables in one document. so my code so far:

$(document).ready(function() {

      //This is a simple array with id's to apply them dataTable
      let tableID = ['bonirap-table', 'bonirap2-table', 'nivel1-table']

      let tables = [];

      for (i=0;i<3;i++) {

        let all = $('#'+ tableID[i]).DataTable({
          "language": {
              "lengthMenu": "Mostrando _MENU_ registros",
              "zeroRecords": "Sin coincidencias",
              "info": "Mostrando página _PAGE_ de_PAGES_",
              "infoEmpty": "No hay registros disponibles",
              "infoFiltered": "(filtrado de _MAX_ registros)"
          },
          aaSorting: [], //Sin sorting inicial
          "dom": 'Bfrtip',
          "buttons": [
              'print',
              'copyHtml5',
              'csvHtml5',
              {
                extend: 'pdfHtml5',
                orientation: 'landscape',
                fontSize: 15
              },
              {
               /*This button will print all tables in one single document*/
                text: 'PDF ALL',
                action: function ( e, dt, node, config ) {

                  let newDt = $.fn.dataTable.tables( { visible: true, api: true } )

                  $.fn.dataTable.ext.buttons.pdfHtml5.action.call(this, e, newDt, node, config);

                }
              }
              
          ]
        });

        tables.push(all)

      }

And when i pass the "newDt" variable to call() it only takes the first table, what i saw it's that the function takes var data = dt.buttons.exportData( config.exportOptions ); and this will take only the first table's information to print.

I also try something with the "tables" array created after applying dataTable on each table:

for (i=0;i<3;i++) {
          // tables[i].button('.buttons-print').trigger();
          let data = tables[i].buttons.exportData( {
              modifier: {
                  selected: true
              }
          });

          dataFromTables.push(data)

        }

This gave me the data that i need but i don't know how can i print it after this.

Is there a way to maybe merge all the information that the function call() needs in order to take all headers and body info? Or another easier way to do this?

Thanks in advance.
P.S. sorry for my poor english

colin

This thread should help, it's asking the same thing.

Cheers,

Colin

alxsan

It really helped me and worked fine! thanks a lot @colin i really appreciate your help!