how to highlight rows based on cell content in a server side processing environment?

how to highlight rows based on cell content in a server side processing environment?

rw1rw1 Posts: 42Questions: 0Answers: 0
edited August 2012 in DataTables 1.9
hello,

in an environment using server side processing, i want to highlight a row based on the content of one cell.

using the three different css 'grades' that are in the demo (gradeA, gradeC, gradeX) i want there to be three color options depending on the content of the cell, for example:

- a cell with the content 'option1' has a row color controlled by tr class gradeA
- a cell with the content 'option2' has a row color controlled by tr class gradeC

i can see people have found answers in this thread (http://datatables.net/forums/discussion/679/highlighting-rows/p1) to achieve this but unfortunately i can't understand them (i don't understand the syntax and code i am looking at).

so i think there are three files i have to modify to get these results:

- the css files (using the ones included in the demo ie demo_page.css and demo_table_jui.css)
- the html file (using the one in the demo ie examples/server_side/server_side.html)

in the html document's head i have:
[code]

@import "https://xxxx.com/xxxx/media/css/demo_page.css";
@import "https://xxxx.com/xxxx/media/css/demo_table_jui.css";
@import "https://xxxx.com/xxxx/examples/examples_support/themes/ui-darkness/jquery-ui-1.8.22.custom.css";




$(document).ready(function() {
$('#example').dataTable( {
"bJQueryUI": true,
"sPaginationType": "full_numbers",
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "path/examples/server_side/scripts/server_processing.php",
"aLengthMenu": [[15, 30, 45, -1], [15, 30, 45, "All"]],
"iDisplayLength": 15,
"fnRowCallback": function( nRow, aData, iDisplayIndex ) {
if(aData[0].search("option1")>-1){
$(nRow).addClass("gradeA");
}
return nRow;
}
} );
} );

[/code]

and the table is displaying without any rows highlighted unfortunately.

can anyone please tell me the code i have to use to get this to work?

thank you!

ps i don't know what aData stands for - does that mean it is searching all rows and columns for the 'option1' phrase?

thank you!

Replies

  • rw1rw1 Posts: 42Questions: 0Answers: 0
    edited August 2012
    i hope i don't complicate things, but this example looks like it is achieving what i want to do:

    http://datatables.net/release-datatables/examples/server_side/ids.html

    so i have tried using the script given in that example and am using this initialisation code:
    [code]

    $(document).ready(function() {
    $('#example').dataTable( {
    "bJQueryUI": true,
    "sPaginationType": "full_numbers",
    "bProcessing": true,
    "bServerSide": true,
    "sAjaxSource": "path/examples/server_side/scripts/id.php",
    "aLengthMenu": [[15, 30, 45, -1], [15, 30, 45, "All"]],
    "iDisplayLength": 15
    } );
    } );

    [/code]
    my question is:

    how do i apply a class to a row using this example?

    thank you!
This discussion has been closed.