Datatables - add row / columns for export

Question

Datatables - add row / columns for export

I want to add some data to the exporting csv

from the export button datatables

which is not in the start table in the view.

The table in the form of headings looks like this: below is the data below.

ID | Name | Address | Contact | Description

I'm trying to get it so that when the export and create button is clicked, a csv

new row is added to the beginning, which will have values in two cells above the id and name, and also adding new columns at the end of the table (after the description field).

I tested using an example I found using the "customize" function but couldn't get this to work correctly.

Any pointers would be appreciated!

How I would like:

Nickname | Value

Action   | ID    | Name | Address | Contact | Description | Date | Code

Edit:

var table;
$(document).ready(function () {

var filetitle = "file";
if (document.getElementById("csvfilename") !== null) {
    filetitle = document.getElementById("csvfilename").textContent;
}

table = $('.datatables').DataTable({
    "initComplete": function () {
        $('.datatables').attr("hidden", false);
    },
    stateSave: true,
    deferRender: true,
    responsive: {
        details: {
            display: $.fn.dataTable.Responsive.display.childRowImmediate,
            type: ''
        }
    },
    paging: $(".datatables").find("tbody tr").length > 10,
    lengthChange: false,
    dom: 'lfrtip',
    buttons: [
        {
            extend: 'csv',
            title: filetitle,
            exportOptions: {
                columns: ':visible'
            }
        },
        {
            extend: 'excel',
            title: filetitle,
            exportOptions: {
                columns: ':visible'
            }
        }
    ]
});
$(".dt-buttons").hide(); //Hide redundant buttons
table.search("").draw(); //Clear search filter

//Export current table contents to CSV in browser.
$(".export-csv").on("click", function (e) {
    e.preventDefault();
    table.button('0').trigger()
});

$('.pagelength').on('click', function () {
    var length = $(this).data('value');
    table.page.len(length).draw();
});

$(window).resize(function () {
    table.draw();
});
});

The aforementioned js file that will handle the datatypes for the view and the code when the export is clicked.

I got errors when I tried to implement and change this. The error was that it was not being used. I added this to the export button called.

customize: function (xlsx) {
    console.log(xlsx);
    var sheet = xlsx.xl.worksheets['sheet1.xml'];
    var downrows = 3;
    var clRow = $('row', sheet);
    //update Row
    clRow.each(function () {
        var attr = $(this).attr('r');
        var ind = parseInt(attr);
        ind = ind + downrows;
        $(this).attr("r",ind);
    });

    // Update  row > c
    $('row c ', sheet).each(function () {
        var attr = $(this).attr('r');
        var pre = attr.substring(0, 1);
        var ind = parseInt(attr.substring(1, attr.length));
        ind = ind + downrows;
        $(this).attr("r", pre + ind);
    });

    function Addrow(index,data) {
        msg='<row r="'+index+'">'
        for(i=0;i<data.length;i++){
            var key=data[i].k;
            var value=data[i].v;
            msg += '<c t="inlineStr" r="' + key + index + '" s="42">';
            msg += '<is>';
            msg +=  '<t>'+value+'</t>';
            msg+=  '</is>';
            msg+='</c>';
        }
        msg += '</row>';
        return msg;
    }

    //insert
    var r1 = Addrow(1, [{ k: 'A', v: 'ColA' }, { k: 'B', v: '' }, { k: 'C', v: '' }]);
    var r2 = Addrow(2, [{ k: 'A', v: '' }, { k: 'B', v: 'ColB' }, { k: 'C', v: '' }]);
    var r3 = Addrow(3, [{ k: 'A', v: '' }, { k: 'B', v: '' }, { k: 'C', v: 'ColC' }]);

    sheet.childNodes[0].childNodes[1].innerHTML = r1 + r2+ r3+ r4+ sheet.childNodes[0].childNodes[1].innerHTML;
}