How can I use ellipsis.render and allow end-user to download non-truncated column?

gratefuldave

I am using the following options for my dataTable:

{
        dom: 'Bfrtip',
        buttons: [
            'copy', 'csv', 'excel', 'pdf', 'print'
        ],
        select: true,
        columnDefs: [{
            targets: 0,
            render: function (d, type, row) {
                if (d.length < 50) {
                    return d;
                }
                let shortened = d.substr(0, 49);
                return '<span class="ellipsis" title="' + d + '">' + shortened + '&#8230;</span>';
            }
        }]
    }

Everything works as expected. I am a new developer. Can you recommend a solution that would allow the end-user to download the non-truncated column?

kthorngren

Try using columns.render to display the ellipsis for only the display operation as described here:
https://datatables.net/manual/data/orthogonal-data

Something like this:

          render: function (d, type, row) {
            if (type === "display") {
                if (d.length < 50) {
                    return d;
                }
                let shortened = d.substr(0, 49);
                return '<span class="ellipsis" title="' + d + '">' + shortened + '&#8230;</span>';
             }
             return d;
          }

This way the column data remains the full/original data. This will also allow for searching and sorting using the original data. The export should export the full data this way.

Kevin

Rawland_Hustle

@kthorngren I'm using your code but the data is still cut off in the Excel export. See https://themeadow.se/ntjperrors/index.html. What's wrong?

kthorngren

@Rawland_Hustle Use Orthogonal data to return the full data for the export as shown in this example. You could use one of the built in operations like sort or if you want to be explicit you could create a new one like the example.

Kevin

Rawland_Hustle

@kthorngren Worked perfectly! Thank you!