columnDefs target class not working

bernhardb

hi!

i am developing a module for the awesome processwire cms for datatables: https://processwire.com/talk/topic/15524-preview-rockdatatables/

the principle is to populate all the columDefs BEFORE initializing the table because that way i can control most of it on the backend and modify only the needed columns by referencing them via their name and not via their index (this makes rearranging/removing/adding columns via the backend very easy).

i have a table that should render currency values as formatted locales, so i created a render function for this:

$(document).ready(function() {
    
    // setup variables
        var opt = ProcessWire.config.dt_kundenliste; // options from backend
        var colDefs = []; // column definitions

    // custom column definitions here
        colDefs.push({

---------------
            targets: 'euro', // does NOT work :(
            // [3,4,5] works
            // opt.colnames.indexOf('net2017'), works
---------------

            render: function ( data, type, full, meta ) {
                if(type === 'display') {
                    var num = parseFloat(data);
                    if(num) {
                        return num.toLocaleString('de-DE', {
                            /*style: 'currency', 
                            currency: 'EUR',*/
                            minimumFractionDigits: 2 
                        });
                    }
                }
                return data;
            },
        });

    // load default column definitions
        colDefs = colDefs.concat(dtGetDefaultDefs(opt));

    // initialise table
        $('#dt_kundenliste').DataTable({
            ajax: {
                url: './kundenliste/',
                type: 'post',
                data: function(d) {
                    d.year = $('#year').val();
                },
            },
            columnDefs: colDefs,
            /*scrollY: "400px",
            scrollCollapse: true,*/
            scrollX: "100%",
            pageLength: 10,
        });
});

the default coldefs are populated like this:

/**
 * get default options for columns
 * @param  {object} opt; options that are set via PHP
 * @return {array}
 */
var dtGetDefaultDefs = function(opt) {
    var defs = [];

    // loop over all columns
    var i;
    for(i=0; i<opt.cols.length; i++) {
        defs.push({
            targets: i,
            title: (opt.cols[i].title ? opt.cols[i].title : opt.cols[i].name),
            data: opt.cols[i].name,
            className: opt.cols[i].class,
        });
    }
    
    //console.log(defs);
    return defs;
}

the problem is that is does NOT work when using a classname to select. but the classname is defined properly (see screenshot).

am i doing anything wrong or is this a bug?
thank you for your help!!

bernhardb

any ideas?