Render and footercallback issue

Keith_H

Hi.

I have a table which creates a footer and sums the columns with a certain class on it. This all works fine, but if i render the cells to have hyperlinks, the column does not total (it's empty).

The table gets built and then rows added by:

$('#table').dataTable().row.add([
...
]};

Table creation:

            $('#table').dataTable({
                  "autoWidth":false
                , "footer": true
                , "info":false
                , "JQueryUI":true
                , "Order":[0,'asc']
                , "ordering":true
                , "paging":false
                , "scrollY":"650px"
                , "scroller":true
                , "scrollCollapse":true
                , "columnDefs": [
                            { className: "LeftNoWrap",   "targets": [ 0,1,2,3,4 ] }
                        ,   { className: "RightNoWrap",  "targets": [ 5,6,7,8,9,10,11,12,13,14,15,16,17 ] }
                        ,   {"targets": [6,7,8,9,10,11,12,13,14,15,16],
                                "data": null,
                                "render": function ( data, type, row, meta ) {
                                    var locRow = meta.row;
                                    var locCol = meta.col;
                                    var locPd  = parseInt(locCol) - 4;
                                    var locWbs = row[0];
                                    return  '<a id="hrefWbsEmpYearSummBookings_'+locRow+'_'+locPd+'" href="#" >'+row[locCol]+'</a>';
                                                }
                            }
                    ]
                , "footerCallback": function ( row, data, start, end, display ) {
                                var api = this.api(), data,total;

                                api.columns('.sum2', {}).every(function() {
                                    var locSum = this
                                        .data()
                                        .reduce(function(a, b) {return fncSumDataTableColumn(a,b);}, 0);
                                    $(this.footer()).html(fncFormatNumber(locSum,2,"Y","Y"));
                                });
                        }
            });

Thanks for any help.

Keith_H

Further information:

If the cells in the column have been rendered to be a hyperlink, the

.reduce(function(a, b)

returns the whole row (as an array) in parameter b.

If the cells have not been rendered, then I just get the cell value in parameter b.

i.e. .reduce(function(a, b)) is .reduce(function(0, array(18) ) [not the word array, the actual row is the array].

If not rendered I get .reduce(function(0, "10.00"))

colin

Hi @Keith_H ,

You're in the right direction, it needs the function in the reduce() to be a bit cleverer. We're happy to take a look, but it's going to be very dependent upon how your column data looks, so it would be better if you could link to a test case/fiddle or link to your page. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

Cheers,

Colin

Keith_H

Hi Colin.

http://live.datatables.net/jumopuwo/1/edit

I think I've done this correctly.

Note : I've removed some of the functionality where it was using local functions to format the output. etc. but it still demonstrates the issue.

Thanks.

Keith.

colin

Hi @Keith_H ,

I'm hoping it's this simple... You were clearing down data in the columns.data - if you remove that line (I commented it out) like this, everything works. Was the data being nulled for a reason?

Cheers,

Colin

Keith_H

Hi Colin.

Thanks for the solution, that all works great now.

Probably come code I'd copied from somewhere else. Strange that it only affected the calculation of a rendered column.