javascript Datatable.js how to show value based on previous column

Question

I am using datatables.js from datatables.net and trying to show a column based on prev col. Like if prev col has got value < 0 then Dr else CR.

I have tried the following script:

$(document).ready(function() {
    var oTable = $('#transaction-list-results').dataTable( {
        "bJQueryUI": true,
        "sPaginationType": "full_numbers",
        "bProcessing": true,
        "sAjaxSource": "ajax/transactions.php",
    "aaSorting": [[0, 'asc']],
    "bAutoWidth": false,
        "aoColumns": [
            { "mData": "ref_no", 'sWidth': '100px' },
            { "mData": "date", 'sWidth': '100px', "mRender": function(data, type, row){return localizeDateStr(data);}},
            { "mData": "desc", 'sWidth': '300px' },
            { "mData": "amount", 'sWidth': '75px', "sCalss": 'amount' },
        { "mData": "depo", 'sWidth': '75px', "mRender": function(data, type, row){return data;}},
        { "mData": "width", 'sWidth': '75px', "mRender": function(data, type, row){return data;}},
        { "mData": "transfer", 'sWidth': '75px', "mRender": function(data, type, row){return data;}}
        ]
    } );
} );

Result of my transaction.php file:

{"aaData":[{"ref_no":"4345643532","date":"2012-10-09T17:36:28Z","desc":"Western Union","amount":-50,"depo":"","width":"","transfer":""},{"ref_no":"4324","date":"2012-10-09T17:28:06Z","desc":"123","amount":-10,"depo":"","width":"","transfer":""},{"ref_no":"4324","date":"2012-10-09T17:27:48Z","desc":"123","amount":3.45,"depo":"","width":"","transfer":""},{"ref_no":"123","date":"2012-10-05T20:56:11Z","desc":"abc","amount":10,"depo":"","width":"","transfer":""},{"ref_no":"12","date":"2012-10-01T16:47:19Z","desc":"autorefill","amount":2000,"depo":"","width":"","transfer":""}]}

Answer 1

So, you actually are already using some functions here that should help.

mRender will allow you render the data displayed in a particular column, defined in your aoColumns definition. You correctly have the three arguments labeled for the function:

• data (the data for the cell, based on the mData key)
• type
• row (the dataset for the entire row)

So you can do something like this:

...
"mRender": function(data, type, row) {
    var valueToCompare = row.someOtherCell
        returnValue = data;

    if (data > valueToCompare) { // or some similar logic
        returnValue = somethingElse;
    }

    return returnValue;
}
...

Also, as a side note - you use mRender several times just to return data . That's not necessary if you're not manipulating the value - this is implicitly done through simply setting the mData property.