add class to dynamic created columns

Khalid Teli

Hi,
I am struggling to assign column name based on column header to dynamically generated columns using:

Here I am checkif the ``columnName == 'vORD', then assing a class='test' to it
for (var i in columnNames) {

               if  (columnNames[i] === 'vORD')   {
                          columns.push({data: columnNames[i],title: columnNames[i]});
                          columns.className = 'test';
                     }
                     else{
     columns.push({data: columnNames[i],title: '<div><span>'+columnNames[i]+'</span></div>'});

                     }

 }

Then I want to use this column class to add color to column background:

    "createdRow": function( row, data, dataIndex ) {
   if ( data.vORD > 0 ) {
     $('td.test', row).addClass('colorCheck');

    }
}

I have been trying hard but failed to come up with any solution.

Thank you

kthorngren

Place the classname in the object, like this:

              if  (columnNames[i] === 'vORD')   {
                         columns.push({data: columnNames[i],
                              title: columnNames[i]},
                              className: 'test'
                         );
                    }

Kevin

Khalid Teli

@kthorngren
Than you. Works perfect.

However, when in column defs I try to render the data using this class name , it doesn't work: For example :
{"target":"test","render":function(data,type,row,meta){return GBPFormatter.format(data)}},

But if is use _all to select all columns , it works fine

{"target":"_all","render":function(data,type,row,meta){return GBPFormatter.format(data)}},

kthorngren

However, when in column defs I try to render the data using this class name , it doesn't work

I can see that. You are asking Datatables to apply the classname to the columns and at the same time look for those columns using that same classname.

I would look at using a global variable that contains an array of indexes that you apply the classname to. Then use that variable as the columnDefs.targets. For example:

var classTestIndexes = [];  // Defined before Datatables init code.

.......
if  (columnNames[i] === 'vORD')   {
           columns.push({data: columnNames[i],
                title: columnNames[i]},
                className: 'test'
           );
           classTestIndexes.push( i );
      }

Then use classTestIndexes for the columnDefs.targets.

Kevin

Khalid Teli

@kthorngren amazing, works perfect.
Thank you very much. as always appreciate your help.

Kind Regards
KT