Header row not printing in PDF

cachiap · August 2018

I'm having a problem trying to get the Header row added to the columns in my PDF. I have read through the section on buttons and have been able to set up the pdf to print as follows:

                buttons: [           
                'copy', 'excel', 'csv' , 
                        
                    {extend: 'pdf',
                       pageSize: 'letter',
                       orientation: 'landscape',
                       
                       
                       exportOptions: {
                       columns: ':visible',
                         rows: ':visible',
                         header: 'true'                  

                      }
                     }
        
                ],

I get the expected result but without the column titles which is annoying. Can someone suggest where I'm going wrong. I am using DataTables 1.10.7 with Buttons-1.2.2

colin · August 2018

Hi @cachiap ,

The final example on this page here looks like what you're after - it shows how to format the header cells. If that doesn't work, could you could link to a running test case showing the issue so we can offer some help. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

Cheers,

Colin

cachiap · August 2018

Hi Colin,

I'm a bit out of my depth here. Could you give me some further clues. I have been to the link you sent and I think I see that I need to set up the buttons.exportData() using

var table = $('#myTable').DataTable();
 
var data = table.buttons.exportData( {
    format: {
        header: function ( data, columnIdx ) {
            return columnIdx +': '+ data;
        }
    }
} );

// Do something with the 'data' variable

but I would sure appreciate it if you could give me some idea of how I use the 'data' variable to express the header.

allan · August 2018

First think I would suggest is updating. Buttons 1.2.2 is fairly old. It would be odd for certain if it didn't export the header - I'd like to think we would have caught that before release, but stranger things have happened.

The other thing that stands out to me in your code is header: 'true'. It should be a boolean value - remove the apostrophes.

Finally, if that doesn't work and you can't update, can you link to a page showing the issue?

Allan

cachiap · August 2018

Allan, thanks for your response. I made the change you suggested, removed the quotes from 'true', but still no header on the pdf file produced. I had updated the file to use Buttons 1.5.1 as well thinking that may be the problem but that didn't work either. I am unable to send a link right now but will get back to you in a day or so when I'm at my home computer.

Thanks,

Paul

allan · August 2018

Hi Paul,

That would be great - thanks. I think I'll need to be able to trace this one through to understand what is going wrong.

Regards,
Allan

cachiap · August 2018

Alan,
I have a link set up to the page with the problem. Could I send it to you privately?

Regards,

Paul

allan · August 2018

Absolutely - click my forum user name above and then the Send message button.

Allan

cachiap · August 2018

Hi Allan,

I sent the link last Sunday using your private message post as you instructed. Could you let me know that you got it.

Thanks,

Paul

allan · August 2018

Gah sorry - I did and totally missed it. Let me get back to you tomorrow about this.

Allan

allan · August 2018

Right - I'm back up to speed now! The issue here is that your header doesn't actually have any information in it that Buttons will export by default. It will automatically strip HTML tags, and you are using input elements as both the header title and a search input.

Its personal style, but I would typically suggest you have two header rows - one for the titles (which will be used for the sort and export) and a second one which contains the inputs for searching.

If you didn't want to do that, you could use an export formatter for the header and read the placeholder attribute from the input elements, and return that as the title for the export.

Allan

cachiap · September 2018

Hi Allan,

Thanks for your help. The idea of two header rows solved the problem. I found a great example at http://live.datatables.net/dikuduka/1/edit.

Thanks to kthorngren for posting this solution.

Cheers,

Paul

cachiap · September 2018

Allan,

Could you check your private messages again. I have an issue that is occurring with the search and I'm not sure if it's an issue with the new search code or a problem with my remote server.

Thanks,

Paul

cachiap · September 2018

Allan,

This new script works great.

    table.columns().eq( 0 ).each( function (columnIndex) {
        $( 'tr:eq(1) th', table.table().header() )
                      .eq( columnIndex )
                      .find('input')
                      .on( 'keyup change', function () {
                         table
                            .column(columnIndex)
                            .search( this.value )
                            .draw();
                        } );
                    } );

Thanks for all your help and patience. Looking forward to DT2.

Cheers,

Paul

Header row not printing in PDF

Header row not printing in PDF

Answers

Howdy, Stranger!

Categories

DataTables

Header row not printing in PDF

Header row not printing in PDF

Answers

Howdy, Stranger!

Quick Links

Categories

DataTables