footerCallback issue

mbedukaty

Hello everyone and happy new year (soon),

I'm trying to implement with footerCallback function the sum of H:m type data. Here is the code :

    footerCallback: function ( row, data, start, end, display ) {
        var api = this.api();

        var intVal = function ( i ) {

                    return moment.duration(i).hours();

        };

        var intVal2 = function ( i ) {

                    return moment.duration(i).minutes();

        };


            if (api.column(0).data().length){ 
            var total1 = api
            .column(0)
            .data()
            .reduce( function (a, b) {
            return intVal(a) + intVal(b);
            } ) }
            else{ total1 = 0};

            if (api.column(0).data().length){   
         var total2 = api
            .column(0)
            .data()
            .reduce( function (a, b) {
            return intVal2(a) + intVal2(b);
            } ) }
            else{ total2 = 0};



        // Update footer
        $( api.column(0).footer() ).html(
            +total1+ Math.floor(total2/60) + ':' + Math.ceil((total2/60 - Math.floor(total2/60))*60)
        );

    },

It's working when there are 2 elements in the column, but when it comes to be more, the last data only is displayed on the footer and I can figure why.

Thanks in advance for the support :)

allan

Try passing in an initial value to the reduce function (second parameter):

.reduce( function (a, b) { ... }, 0 )

If that doesn't work, could you post a link to a page that shows the issue please?

edit Re-reading the code, I'm not sure that will fix it actually (although it does mean you won't need the if / else). Could you post a link please?

Allan

mbedukaty

Thank you Allan for your feedback.
Here is the link :
http://www.adescomaroc.com/POINTAGE/POINTAGE58/pointage.html

Footercallback was done on the first column. You can add a third data and notice the issue.

Thanks.

allan

The issue is with the intVal function and the values passed into it. On first run of reduce a is 04:04:26 (or whatever) but on the second loop it is 4 (i.e. the hours). Moment failed to parse that as a string (correctly) hence the issue.

I'd suggest using:

var intVal = function ( i ) {
  return typeof i !== 'string' :
    i :
    moment.duration(i).hours();
};

Likewise for intVal2.

Allan

mbedukaty

Thank you very much Allan, it works replacing " : " by ?. Here is the code if someone need to sum hours or minutes :

var intVal = function ( i ) {
return typeof i !== 'string' ?
i :
moment.duration(i).hours();
};

May I ask you something else. Footercallback function works perfectly for me when data are stored in the sql table but for data computed on the client side, it doesn't. How can I correct this point.

Many thanks.

allan

Oops - yes. Thanks for spotting the typo.

data computed on the client side, it doesn't. How can I correct this point.

Use cells().render() to get the rendered / computed values (i.e. instead of cells().data()).

Allan

mbedukaty

Thank you allan !!!