简体   繁体   中英

Jquery Datatables Ajax method - set cell class

I cannot find this feature anywhere. Is it possible to add a class to a column in the table, when using the PHP server processing of the DataTables sorting/paging? Becasue the PHP script only returns the cell data, not any settings. Example: I have column with a positive or negative value. I want to highlight the cell either green when the number inside is positive, or red if it is negative. I use the standard files which are used also in the AJAX source demo

This is my initialisation:

$(document).ready(function() {
    $('#example').dataTable( {
        "bProcessing": true,
        "bServerSide": true,
        "sAjaxSource": "../server_side/scripts/server_processing.php"
    } );
} );

The PHP output return a JSON string, made fro a PHP array, sth like this (generated JSON):

{
  "sEcho":1,
  "iTotalRecords":"3",
  "iTotalDisplayRecords":"3",
  "aaData":[{ "0":"1 Oct 2013","1"=>"-9999","2"=>"11111"  }]
}

I need to set a class to the class for -9999to red and 11111 to green. Any ideas?

http://datatables.net/examples/advanced_init/row_callback.html

You write a custom function for fnRowCallback and check for your set of interested cell indices, if the number is positive or negative. You can then replace the cell content with your custom html.

So, in your case it would be:

    "fnRowCallback": function( nRow, aData, iDisplayIndex ) {
                /* Append the grade to the default row class name */
                if ( aData[1] > 0)
                {
                    $('td:eq(1)', nRow).html( "<span class='green'>" + $('td:eq(1)', nRow).html() + "</span>" );
                } else {
                   //set to red
                }
                // do the same for td[2]
                return nRow;
            },

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM