Treat first column as other columns. That is not have it in a different color.

Treat first column as other columns. That is not have it in a different color.

curiouslearncuriouslearn Posts: 2Questions: 0Answers: 0
edited August 2012 in General
Hi,

**EDITED: the problem is not with the first column but with one that has been used for sorting. I need to remove highlighting from this column**

First of all, thanks a ton for DataTables. I have just started using it and it seems great so far.

I am using the following code to convert a regular table into a DataTable object using:

[code]
$('#historytable').dataTable({
"sScrollY": "175px",
"bPaginate": false,
"bFilter": false // Remove filtering and search box
});
[/code]

The column by which the table has been sorted is highlighted by using a different color. I tried the following css (that appears after the dataTables.css is loaded).

[code]
tr:nth-child(even) td {
background: rgb(240,240,240);
}

tr:nth-child(odd) td {
background: white;
}
[/code]

This does not remove the highlighting. What do I need to do to remove the highlighting of the column by which sorting is done?

Thank you.

Replies

  • cserfosscserfoss Posts: 11Questions: 0Answers: 0
    edited August 2012
    Hi --

    I'm going to make some assumptions but the classes for controlling the background-color of columns are in the demo_table_jui.css file for my implementation:

    [code]
    /*
    * Sorting classes for columns
    */
    /* For the standard odd/even */
    tr.odd td.sorting_1 {
    background-color: #D3D6FF;
    }

    tr.odd td.sorting_2 {
    background-color: #DADCFF;
    }

    tr.odd td.sorting_3 {
    background-color: #E0E2FF;
    }

    tr.even td.sorting_1 {
    background-color: #EAEBFF;
    }

    tr.even td.sorting_2 {
    background-color: #F2F3FF;
    }

    tr.even td.sorting_3 {
    background-color: #F9F9FF;
    }
    [/code]
  • allanallan Posts: 63,540Questions: 1Answers: 10,476 Site admin
    Exactly as @cserfoss says - its the sorting classes that are being applied. If you don't want them, either disable with the bSortClasses option or just remove the styling of them from the CSS.

    Allan
  • curiouslearncuriouslearn Posts: 2Questions: 0Answers: 0
    Thank you, cserfoss and Allan. Based on your posts I inspected the css in chrome and added the following to my css:

    table.dataTable tr.odd td.sorting_1 {
    background-color: white;
    }

    table.dataTable tr.even td.sorting_1 {
    background-color: rgb(240,240,240);
    }

    Allan, thanks again for creating datatables.
This discussion has been closed.