footerCallback

Philou

Hi every body,

The function Math.max is running well

footerCallback: function ( row, data, start, end, display ) {var api = this.api(),data ; var intVal = function (i) {return typeof i === 'string' ?i.replace( /[€,]/g, '' ) * 1 : typeof i === 'number' ? i : 0;};var Salary = api.column(10,{ search: 'applied' }).data().reduce( function (a, b) {return Math.max(a,b);}, 0 );$( api.column(10).footer() ).html(DataTable.render.number('’', '.', 2, '$ ', '').display(Salary));},

The function Math.min is always giving zéro.

footerCallback: function ( row, data, start, end, display ) {var api = this.api(),data ; var intVal = function (i) {return typeof i === 'string' ?i.replace( /[€,]/g, '' ) * 1 : typeof i === 'number' ? i : 0;};var Salary = api.column(3,{ search: 'applied' }).data().reduce( function (a, b) {return Math.min(a,b);}, 0 );$( api.column(3).footer() ).html(DataTable.render.number('’', '.', 2, '$ ', '').display(Salary));},

I cannot fin the reason why it's not giving the minimum of the column.

https://jsbin.com/gipakudofa/1/edit?html,output

kthorngren

I reformatted the footerCallback (so its easier to read) and added a console.log statement so you can see what is happening:
https://jsbin.com/cuqapipogo/1/edit?html,output

footerCallback: function(row, data, start, end, display) {
    var api = this.api(),
        data;
    var intVal = function(i) {
        return typeof i === 'string' ? i.replace(/[€,]/g, '') * 1 : typeof i === 'number' ? i : 0;
    };
    var Salary = api.column(10, {
        search: 'applied'
    }).data().reduce(function(a, b) {
      console.log(a, b);
        return Math.min(a, b);
    }, 0);  // initial value
    $(api.column(10).footer()).html(DataTable.render.number('’', '.', 2, '$ ', '').display(Salary));
},

Since you are starting with 0 as the initial value its always the minimum value. Change this to number higher than what your data will be for the Math.min() function to work.

Kevin

Philou

I changed the table to show the salary column.

https://jsbin.com/mecimomuho/1/edit?html,output

It works with a higher start value as the minimum. But if you don't know it ?
Is there a way to get the result without knowing in advance what is approximately the minimum ?
I tryed to put a hight number, 1 Mio to be sure, but it slow down the output.

An other solution would be to get first the maximum and use it as starting ?

Philippe

Philou

footerCallback: function(row, data, start, end, display) {
    var api = this.api(),
        data;
    var intVal = function(i) {
        return typeof i === 'string' ? i.replace(/[€,]/g, '') * 1 : typeof i === 'number' ? i : 0;
    };
    var SalaryMax = api.column(10, {
        search: 'applied'
    }).data().reduce(function(a, b) {
      console.log(a, b);
        return Math.max(a, b);
    }, 0);
  
    var Salary = api.column(10, {
        search: 'applied'
    }).data().reduce(function(a, b) {
      console.log(a, b);
        return Math.min(a, b);
    }, SalaryMax);
    
    $(api.column(10).footer()).html(DataTable.render.number('’', '.', 2, '$ ', '').display(Salary));
},

What do you think ?

https://jsbin.com/picaguyisa/1/edit?html,output

allan

That works. Or you could use Infinity. Or perhaps better would be to do:

let salaries = api
  .column(10, {
    search: 'applied'
  })
  .data()
  .toArray();

let max = Math.max.apply(Math, salaries);
let min = Math.min.apply(Math, salaries);

Personally I prefer this option - I suspect it will be much faster.

Allan

Philou

Thanks for your proposal and you are probably right.
But I don't know the total code for the footerCallback with your smart proposal.
Thanks in advance.

kthorngren

Something like this:

footerCallback: function(row, data, start, end, display) {
    var api = this.api(),
        data;
    var intVal = function(i) {
        return typeof i === 'string' ? i.replace(/[€,]/g, '') * 1 : typeof i === 'number' ? i : 0;
    };

   let salaries = api
    .column(10, {
      search: 'applied'
    })
    .data()
    .toArray();
 
  let max = Math.max.apply(Math, salaries);
  let min = Math.min.apply(Math, salaries);
    
  $(api.column(10).footer()).html(DataTable.render.number('’', '.', 2, '$ ', '').display( min ));
},

Kevin

Philou

Thanks Kevin, it works perfectly

Philou

Thanks Allan