pdfHtml5

nublet

Hi,

i am using pdfHtml5 to export my table, exporting to pdf is working as it should. my problem is, i have 3 colums on the 3rd column i have my data displayed in unordered list, exporting it to pdf makes the unordered list disappear making the data displays in a single wrapped fashion.

here is my script:

var dt = tableContainer.DataTable({

                "dom": 'Bfrtip',
                "lengthMenu": [
                    [ 100, 200, 300, 400, 500, -1 ],
                    [ '100 rows', '200 rows', '300 rows', '400 rows', '500 rows', 'Show all' ]
                ],
                "buttons": [
                            'pageLength',
                            {
                                extend: 'pdfHmtl5',
                                title: 'this is designed to work'
                            }
                         ],
                "bStateSave": false,
                "processing": true,
                "serverSide": true,
                "pageLength": 100,
                "order": [[ 0, "desc" ]],
                "bInfo" : true,
                "bFilter" : false,
                "language": {
                    "infoFiltered": ""
                },
                "columns": [
                            { "type": "integer", "orderable": true, "className": "vtop" },
                            { "type": "string", "orderable": false, "className": "vtop" },
                            { "type": "string", "orderable": false }                    
                           ],          
                "bSort": true,

                "ajax": base + "/folder/folder/ajax_folder_list.php"+vars

        });

i have also read the document for pdfHtml5 and makePDF, i just dont know where to start.

regards,

allan

By default Buttons will strip HTML from the exported data (see this thread). You probably need to include the HTML, but also process it so that pdfmake will show line breaks for the list items. I'm not entirely sure how that is done with their API.

Allan

nublet

i checked and tested the link you provided, setting the stripNewlines in my script.

{
    extend: 'pdf',
    text: 'Save PDF',
    exportOptions: {
        stripNewlines: false
    }
} 

with no effect in the exported pdf file. reading further the pdfmake docs. it say..

content: [
    'Bulleted list example:',
    {
      // to treat a paragraph as a bulleted list, set an array of items under the ul key
      ul: [
        'Item 1',
        'Item 2',
        'Item 3',
        { text: 'Item 4', bold: true },
      ]
    },

i tried fiddling with format export options and customize with no success

example export options:

exportOptions: {
            format: {
                body: function ( data, column, row ) {
                    // Strip $ from salary column to make it numeric
                    return column === 5 ?
                        data.replace( /[$,]/g, '' ) :
                        data;
                }
            }
        }

example customize function:

buttons: [ {
            extend: 'pdfHtml5',
            text: 'PDF with image',
            customize: function ( doc ) {
                // Splice the image in after the header, but before the table
                doc.content.splice( 1, 0, {
                    margin: [ 0, 0, 0, 12 ],
                    alignment: 'center',
                    image: 'data:image/png;base64,...'
                } );
                // Data URL generated by http://dataurl.net/#dataurlmaker
            }
        } ]

still thinking where and how i can manipulate the script just like in the makepdf docs.

best regards,

allan

I think its going to come down to modifying the document structure that Buttons generates - specifically for the column in question. If you have a look at the pdfmake playground and then load the "tables" example the second table shows how it is possible to get a list into the table:

    {
        stack: [
            'Let\'s try an unordered list', {
                ul: [
                    'item 1',
                    'item 2'
                ]
            }
        ]
    },

That's probably not going to be trivial to implement I'm afraid, but it looks like it should be possible.

Allan