PDF Export not working
PDF Export not working
tbithell
Posts: 13Questions: 3Answers: 1
http://live.datatables.net/pevetepa/1/edit?html,css,js,console,output
I am able to export to excel without issue, but I get an error when I try to export to pdf. I was able to recreate the error, please follow the link above. All of the includes that you see are the ones that I got via the tool provided on the datatables site.
Any help will be much appreciated.
This question has an accepted answers - jump to answer
This discussion has been closed.
Answers
In the Chrome console I see:
I think this is expect to JSBin and how it is operating. It should be that on its own page that works correct. I've just uploaded the code from the bin to a static file and it seems to work as expected.
Allan
I see what is going on, so I have one other issue with this, that is really how to exclude something from the pdf. I have added some code that puts filter dropdowns under each column header... http://live.datatables.net/pevetepa/2/edit
When I click export to PDF it works fine, I removed the portion that made it open in a new window for testing purposes, BUT it also includes all the drop down values and wreaks havoc on the pdf formatting.
I have been working with the following, but can't get it to work. I'm honestly, just not quite sure where to put it...
"exportOptions":[
{
"format":[{
"header": function(data)
{
The above is a modified version of the code found here...
https://datatables.net/reference/api/buttons.exportData()
Specifically...
var data = table.buttons.exportData( {
} );
I'm having this same issue with Excel, so answering this question can close out a couple questions at once. I wouldn't have opened both had I realized that the PDF export worked fine.
So the issue here is that to get the header text, Buttons reads the html for the cell and then strips the HTML tags. The result is that you are left with only the plain text.
You could alter the code so it doesn't do that, however, I would recommend changing your table slightly so that the input select elements are on a different row in the table's header. Add another
tr
where they can be placed and useorderCellsTop
to tell DataTables to use the top row in the header as the main titles for the columns.That will also fix the issue in your example whereby the table is ordered if you click on a select element in the header.
Allan
Thanks so much! I'm looking at this and trying to sort out how to change this line, so that I append the select to the second row in the header,
var select = $('<br /><select style="width:75px; text-align:left;"><option value=""></option></select>').appendTo( $(column.header()) ).on( 'change', function () {
Any idea how to do that?
Got that part sorted out via... .appendTo( $('.two')[counter] ) or something similar. Now I'm just trying to sort out how to make that work when the table is populated dynamically.
Woohoo, got it. Just in case anyone is using json to populate their table like I am I added the following... Previously I just had the table tags and <thead> and <tbody> tags. I know, I know hardcoding it is kind of lame, but I was already hardcoding the column headers in the javascript
Thanks for posting back with your solution. Good to hear you got it working.
Allan