i need help to print pdf of my datatable with grouping.

ziovik

i have already added the _exportData = function ( dt, inOpts ) and my buttons. but it still get pdf without grouping.

my button

 {
        extend: 'collection',
         text: 'Распечатать накладную ' + '<i style="color: green" class="glyphicon glyphicon-print"></i>',
        'buttons': [
           {
                 extend: 'print',
                 exportOptions: {
                    grouped_array_index: [0] //note the brackets, i think this is so you can group by multiple columns.
                }
            }
        ],
     },
}

my table

 var datatable = appCreateSimpleDataTable({
        section: 'cat-awaitingDeliveryFilterInvoice',
        columnSearch: true,
        columns: columns_invoice_order,
        select: {
            style:    'os',
            selector: 'td:first-child'
        },
        fields: form_invoice_order,
        clearbtns: true,
        buttons: buttons_invoice_order,
        rowGroup: {
            dataSrc: 'group'
        },

        dtOptions: {
            select: {
                style:    'os',
                selector: 'td:first-child'
            },
            // "scrollY": "200px",
            "order": [[0, "asc"]],

            dom: 'Brtip',
            "pageLength": 100,
            'searchCols': [
                null,
                null,

            ],
            'columnDefs': [
                // {
                //     "render": (data, type, full) => {
                //     },
                //     "targets": [0]
                // },
                { "name": "posting_number",   "targets": 0 },
            ],
            "processing": true,
            "serverSide": true,
            "paging": true,

            "ajax": {
                "url": "/cat-api-ozon/load_invoice",
                "type": "POST",
                "data" : {shipmentDate:shipmentDate, warehouseId:warehouseId},
                // success: function(response) {
                //     console.log(response)
                // },
                // error: function(response) {
                //     console.log(response)
                // }
            },
            'rowCallback': function(row, data, dataIndex){
                $(row).css("cursor", "pointer");

            },

            "createdRow": function( row, data, index ) {
                if(data.read_status === 0){
                    $('td', row).css('background-color', '#f2e5d0');
                }
            },
            "drawCallback": function ( settings ) {
                var api = this.api();
                var rows = api.rows( {page:'current'} ).nodes();
                var last=null;

                api.column(0, {page:'current'} ).data().each( function ( group, i ) {
                    if ( last !== group ) {
                        $(rows).eq( i ).before(
                            // '<tr class="group"><td colspan="5">'+group+'</td></tr>'
                             '<tr class="group" style="height: 2px; background: grey"><td colspan="5"></td></tr>'
                        );

                        last = group;
                    }
                } );

                datatable.columns().eq(0).each( function (index ) {
                    var column = datatable.column( 0 );
                    var data = column.data();

                    for (let i = 0; i < data.length - 1; i++) {
                        if (data[i] === data[i + 1]) {
                            // console.log("We have a match!");
                        }else{
                            // console.log("We dont have a match!");
                        }
                    }
                } );
            }
        },
        beforeModalOpen: function () {
        },
        afterFillForm: function (data) {
        }
    });

but it still gives me pdf without grouping. i have tried all. i need help please

Edited by Allan - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.

allan

grouped_array_index isn't a property I recognise - I'm not sure where that comes from and I don't see it referenced anywhere else in your code?

I'm afraid that our export options to not currently support the RowGroup extension.

Allan

ziovik

{
        extend: 'collection',
         text: 'Распечатать накладную ' + '<i style="color: green" class="glyphicon glyphicon-print"></i>',
        'buttons': [
           {
                 extend: 'print',
                 exportOptions: {
                    grouped_array_index: [0] //note the brackets, i think this is so you can group by multiple columns.
                }
            }
        ],
     },
}

this is the button. where i want group to be in the first column. and the grouped_array_index is also in the function;

var _exportData = function ( dt, inOpts )
{
    var config = $.extend( true, {}, {
        rows:           null,
        columns:        '',
        modifier:       {
            search: 'applied',
            order:  'applied'
        },
        orthogonal:     'display',
        stripHtml:      true,
        stripNewlines:  true,
        decodeEntities: true,
        trim:           true,
        format:         {
            header: function ( d ) {
                return strip( d );
            },
            footer: function ( d ) {
                return strip( d );
            },
            body: function ( d ) {
                return strip( d );
            }
        },
        customizeData: null
    }, inOpts );

    var strip = function ( str ) {
        if ( typeof str !== 'string' ) {
            return str;
        }

        // Always remove script tags
        str = str.replace( /<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi, '' );

        // Always remove comments
        str = str.replace( /<!\-\-.*?\-\->/g, '' );

        if ( config.stripHtml ) {
            str = str.replace( /<[^>]*>/g, '' );
        }

        if ( config.trim ) {
            str = str.replace( /^\s+|\s+$/g, '' );
        }

        if ( config.stripNewlines ) {
            str = str.replace( /\n/g, ' ' );
        }

        if ( config.decodeEntities ) {
            _exportTextarea.innerHTML = str;
            str = _exportTextarea.value;
        }

        return str;
    };


    var header = dt.columns( config.columns ).indexes().map( function (idx) {
        var el = dt.column( idx ).header();
        return config.format.header( el.innerHTML, idx, el );
    } ).toArray();

    var footer = dt.table().footer() ?
        dt.columns( config.columns ).indexes().map( function (idx) {
            var el = dt.column( idx ).footer();
            return config.format.footer( el ? el.innerHTML : '', idx, el );
        } ).toArray() :
        null;

    // If Select is available on this table, and any rows are selected, limit the export
    // to the selected rows. If no rows are selected, all rows will be exported. Specify
    // a `selected` modifier to control directly.
    var modifier = $.extend( {}, config.modifier );
    if ( dt.select && typeof dt.select.info === 'function' && modifier.selected === undefined ) {
        if ( dt.rows( config.rows, $.extend( { selected: true }, modifier ) ).any() ) {
            $.extend( modifier, { selected: true } )
        }
    }

    var rowIndexes = dt.rows( config.rows, modifier ).indexes().toArray();
    var selectedCells = dt.cells( rowIndexes, config.columns );
    var cells = selectedCells
        .render( config.orthogonal )
        .toArray();
    var cellNodes = selectedCells
        .nodes()
        .toArray();

    var columns = header.length;
    var rows = columns > 0 ? cells.length / columns : 0;
    var body = [];
    var cellCounter = 0;

    for ( var i=0, ien=rows ; i<ien ; i++ ) {
        var row = [ columns ];

        for ( var j=0 ; j<columns ; j++ ) {
            row[j] = config.format.body( cells[ cellCounter ], i, j, cellNodes[ cellCounter ] );
            cellCounter++;
        }

        body[i] = row;
    }

    var grouped_array_index = config.grouped_array_index;

    if ( !(grouped_array_index == undefined) ) { //don't run grouping logic if rows aren't grouped

        var row_array = dt.rows().nodes();
        var row_data_array = dt.rows().data();
        var iColspan = columns;
        var sLastGroup = "";
        var no_of_splices = 0;

        for (var i = 0, row_length = body.length; i < row_length; i++) {
            var sGroup = row_data_array[i][grouped_array_index];

            if ( sGroup !== sLastGroup ) {
                var table_data = [];

                for (var $column_index = 0; $column_index < iColspan; $column_index++) {
                    if ($column_index === 0)
                    {
                        // strips anything inside < > tags. hoping this won't be an issue in the future.
                        table_data[$column_index] = sGroup.replace( /<[^>]*>/gi, '' ); + " ";
                    }
                    else
                    {
                        table_data[$column_index] = '';
                    }
                }
                body.splice(i + no_of_splices, 0, table_data);
                no_of_splices++;
                sLastGroup = sGroup;
            }
        }
    }

    var data = {
        header: header,
        footer: footer,
        body:   body
    };

    if ( config.customizeData ) {
        config.customizeData( data );
    }

    return data;
};

which i included in my dataTables.buttons.js.

the pdf group is not working. please help.

Edited by Allan - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.

allan

Did you write the code in there for the row grouping? It isn't written nor supported by us. You'd probably be best asking the original author if it wasn't yourself.

Allan

ziovik

i am the author. Just tell me please what to do or show me what im doing wrong.

you mean i should remove this right:
rowGroup: {
dataSrc: 'group'
},
and what else im doing wrong.

ziovik

if you are talking about the function of _exportData. i copied it from one of your link. if its wrong please tell me the right one and where and how to use it

kthorngren

I added lines 108-140 to the dataTables.buttons.js file in this example:
http://live.datatables.net/bakokiva/1/edit

The code works for Print, PDF and Excel.

the pdf group is not working. please help.

Please describe exactly what happens and what is not working.

Make sure you aren't also loading the unmodified dataTables.buttons.js. You only want to load this once. Maybe you need to clear the browser's cache to load the modified file. Make sure you are loading the files in the proper order.

If you still need help then please provide a link to your page or a test case replicating the issue so we can help debug.
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

Kevin

ziovik

https://datatables.net/forums/uploads/editor/5i/h6bgblhjc5b6.docx

i want something like this . not the way you group.

kthorngren

Sorry, I'm not sure what that screenshot is showing. It looks like a standard table to me. Is it grouped somehow?

not the way you group.

Are you not using the rowGroup extension?

Please provide details of exactly what you are looking for.

Kevin

ziovik

http://live.datatables.net/fecoqote/2/

this test lick. i want it to group like that but where the Ashton Cox for example shows twice it should merge that coloumn together only so the Ashton Cox shows once but other details should show. just to merge that two cells and show one of the Ashton Cox and leaves its other cells and row

ziovik

https://datatables.net/forums/uploads/editor/zu/dvvv5myo7y5v.docx

please look at the first column and see the merged cells when the value are thesame

kthorngren

There is a third party plugin called rowsGroup that I think will group the rows the way you want. Note that this is a third party plugin and in not supported by Datatables. Any issue with it will need to go through the developer of the plugin. Also note that this plugin creates rowspan in the tbody which is not supported by Datatables. See the HTML requirements for details.

You can see an example from the fiddle in the first post in this thread.

Export functionality may or may not work with this plugin.

Kevin

ziovik

ok lets try just merging cells. so how can i loop through a specific column and find if the values are thesame then merge cells?

kthorngren

To merge them you will need to create a rowspan in the table rows which is not supported by Datatables. The easiest way to do this is to use the third party rowsspan plugin as the code already does this. However you probably could add some code to the drawCallback function (I guess the second loop you have) to remove the duplicate td elements from the DOM and add the appropriate rowspan to the first td via jQuery.

Either of these options probably won't be exported correctly so custom coding for the export buttons will need to happen if you want these custom groups exported.

Your best option is to use the Datatables RowGroup extension with the export solution posted above.

Kevin

kthorngren

I updated your test case to add the rowspan to merge duplicate cells.
http://live.datatables.net/kozuwugu/1/edit

This is for the table display only. It won't apply to the export.

Since this adds a non-supported rowspan within the Datatables rows it may break some Datatables functionality. You will need to test this in your solution to make sure everything works as expected. If something is not working then this solution may not work for you and you will need to find something else.

Kevin