Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Datatables - highlight selected row [closed]

How to highlight the selected row in datatables. I have updated the html with jquery code datatables in jsfiddle. Please help me to write css to highlight the selected row in different color.

var oTable = $("#products1").dataTable({
       "aaData": newarray,
       "bProcessing": true,
       "bDeferRender": true,
       "bFilter": false,
       "bJQueryUI": true,
       "bRetrieve": true,
       "bPaginate": false,
       "bSort": true,
       "aaSorting": [[4, "desc"]],
       "iDisplayLength": 25,
       "aoColumns": [{"sWidth": "100%","sClass": "center","bSortable": false},
             {
            "sWidth": "150%","sClass": "center","bSortable": false},
             {
            "sWidth": "150%","sClass": "center","bSortable": false},
             {
            "sWidth": "150%","sClass": "center","bSortable": false}


            ],
        "aoColumnDefs": [{ "fnRender": function (o, val) {
            return o.aData[0];
        },
            "sClass": "col1","aTargets": [0]
    }, {
        "fnRender": function (o, val) {

            return o.aData[1];
        },
            "sClass": "col2","aTargets": [1]
    }, {
    "fnRender": function (o, val) {

            return o.aData[2];
        },
            "sClass": "Number","aTargets": [2]
    },{
    "fnRender": function (o, val) {

            return o.aData[3];
        },
            "sClass": "Name","aTargets": [3]
    }]

});

here find jsfiddle

like image 711
user2444474 Avatar asked Jul 01 '13 05:07

user2444474


1 Answers

Check the demo here.

Add this after the table call:

$("#products tbody tr").on('click',function(event) {
    $("#products tbody tr").removeClass('row_selected');        
    $(this).addClass('row_selected');
});
like image 94
yeyene Avatar answered Sep 29 '22 11:09

yeyene