Null value of column

jalape

Good Morning,
I am using a function found on the page https://datatables.net/forums/discussion/46296/calculating-cells-values, to calculate the total value of a numeric column.

{ data: 'vista_item.porcentaje' },

The problem I run into is when I use render to format the column:

{ data: null,
    render: function ( data, type, row ) {
        return data.vista_item.porcentaje + "%";
    }
},

In that case it does not offer any results. I suppose to be of null value.
The function is:

"footerCallback": function ( row, data, start, end, display ) {
    var api = this.api(), data;
 
    // Remove the formatting to get integer data for summation
    var intVal = function ( i ) {
        return typeof i === 'string' ?
        i.replace(/[\$,]/g, '')*1 :
        typeof i === 'number' ?
        i : 0;
    };

    // Total over all pages
    total = api
    .column( 3 )
    .data()
    .reduce( function (a, b) {
         return intVal(a) + intVal(b);
    }, 0 );

    // Total over this page
    pageTotal = api
    .column( 3, { page: 'current'} )
    .data()
    .reduce( function (a, b) {
        return intVal(a) + intVal(b);
    }, 0 );

    // Update footer
    $( api.column( 3 ).footer() ).html(
        pageTotal +'%'+' ( '+ total +'% total)'
    );
}

Thank you

kthorngren

In that case it does not offer any results. I suppose to be of null value.

Are you saying the data doesn't show properly in the table or the sum in the footer is not correct?

See this thread for totaling rendering columns in the footCallback.

Kevin

jalape

Thanks Kevin for answering,
If the field is:

{ data: 'vista_item.porcentaje' },

http://javierlasen.es/easd/datos_001.jpg

But if it is:

{ 
    data: null,
    render: function ( data, type, row ) {
        return data.vista_item.porcentaje + "%";
    }
},

http://javierlasen.es/easd/datos_002.jpg

Study this thread in case it can provide some light.

allan

So if I understand correctly from the screenshots, the problem is not the output in the cell, which appears correct. But rather the count in the footer?

That is happening because of the data: null. That will result in:

    total = api
    .column( 3 )
    .data()

giving you the data object for the whole row. So you can’t just sum it, you either need to pick some data out:

total = api
  .rows()
  .data()
  .pluck(‘vista_item.porcentaje');

Or just use { data: 'vista_item.porcentaje' }, as you originally had. Why can’t you do that?

Allan

jalape

Thanks Allan for answering,
Unfortunately the method has not worked, maybe I am doing the column by row change wrong.
I am doing it like this:

"footerCallback": function ( row, data, start, end, display ) {
    var api = this.api(), data;
 
 
    // Remove the formatting to get integer data for summation
    var intVal = function ( i ) {
        return typeof i === 'string' ?
        i.replace(/[\$,]/g, '')*1 :
        typeof i === 'number' ?
        i : 0;
    };

    // Total over all pages
    total = api
    .rows( )
    .data()
    .pluck('vista_item.porcentaje')
    .reduce( function (a, b) {
        return intVal(a) + intVal(b);
    }, 0 );

    // Total over this page
    pageTotal = api
    .rows( { page: 'current'} )
    .data()
    .pluck('vista_item.porcentaje')
    .reduce( function (a, b) {
        return intVal(a) + intVal(b);
    }, 0 );

    // Update footer
    $( api.rows( ).footer() ).html(
        pageTotal +'%'+' ( '+ total +'% total)'
    );
}

kthorngren

Looks like you changed:

    // Update footer
    $( api.column( 3 ).footer() ).html(
        pageTotal +'%'+' ( '+ total +'% total)'
    );

to

    // Update footer
    $( api.rows( ).footer() ).html(
        pageTotal +'%'+' ( '+ total +'% total)'
    );

There is not an API api.rows( ).footer(). Change it back to what you originally had.

Kevin

jalape

No matter how hard I try, I always run into the problem of the null value column. Is it not possible to make the Callback call by means of an id or a class applied to the column?
To better understand the problem I have uploaded the page to the server:

http://www.javierlasen.es/easd/login/abierto_parentChild.php

To see how it works, write to Search: 1348 and select the record from the first table.

kthorngren

As I mentioned in my first response you are trying to total a column using columns.render you will need to use cells().render() as described in this thread. Specifically this example:
http://live.datatables.net/mixegahu/1/edit

Kevin

jalape

The example has been of great help.
This way it works perfectly:

pageTotal = api
.cells( null, 4, { page: 'current'} )
.render('display')          
.reduce( function (a, b) {
    return (intVal(a) + intVal(b)).toFixed(2);
}, 0 );

I have added: .toFixed (2); to round to two decimal places.
Thank you very much Kevin