How Do I Remove Classes From a Using Render?

puffster

I think I'm close but I'm not doing something quite right, I have a parent table that you can drill down into. The final row is an "Overall" row and there's nothing to drill into, so I want to remove the classes that allow a user to select/drill into that row. I've tried everything I can think of but cannot get the classes to remove. Below is a snippet of what my code looks like, can somebody show me the error of my ways please!?

            columns: [
                {
                    className: 'cumulative-details-control openClose',
                    width: "5%",
                    data: null,
                    defaultContent: '',
                    render: function (data, type, full, meta) {
                        if (data.subject == "Overall") {
                            $(this).removeClass('cumulative-details-control');
                            $(this).removeClass('openClose');
                        }
                    }
                },

Rob Brun

Hi puffster, maybe in your createdRow callback do something like this

"createdRow": function( row, data, dataIndex ) {
     if(data.subject === "overall"){
        $(row).removeClass('cumulative-details-control');
        $(row).removeClass('openClose');
      }
}

https://datatables.net/reference/option/createdRow

Shay

allan

Yes, you can't access the node in the columns.render function at the moment because it might not have been created when that function is called. You have to use a callback as Shay suggests.

Allan

puffster

Thank you both, that was the issue!! I had to make a slight tweak to the jQuery to remove the class, but it's humming now!!

            createdRow: function (row, data, dataIndex) {
                if (data.subject == "Overall") {
                    $(row).find('td').removeClass('cumulative-details-control');
                    $(row).find('td').removeClass('openClose');
                }
            }