Timer at the end of each row

onidemon

Hello,

I am trying to add a timer at the end of each row. I looked up multuple solutions on this forum but none seem to work. The best I got was using rowCallback to apply a class to each cell and then use a time function with querySelector.

The issue with this method is it only works on the first cell and if I try querySelectorAll i get nothing at all. I saw some solutions asking to use cell.data but that too is not working and I need to have the time on every row on the last cell, the amount of rows is dyniamic as it's pulling data from a spreadsheet.

Below is the code I tried based on suggestions here but it does nothing.

function drawTable(dataArray) {
        this.table = $('#data-table')
            .DataTable({
                data: dataArray,
                columns: myColumns,
                columnDefs: [{
                    targets: -1,
                    data: null,
                    render: function(data, type, row, meta) {
                        if (data.includes('Approved')) {
                            return '<button class="btn btn-success">Approved</button>'
                        } else {
                            return '<button class="btn btn-warning">Request</button>'
                        }
                    }
                }],
        "rowCallback": function(row, data, index) {
            var cellValue = data[9];
            if (cellValue=="#time") {
            $("td:eq(9)",row).addClass("timer");
            }
          },
        "initComplete": function(settings, json) {
           // Get the Datatable API instance
           var api = this.api();

          var duration = 60 * 5
          var timer = duration, minutes, seconds;
          setInterval(function () {
          minutes = parseInt(timer / 60, 10);
          seconds = parseInt(timer % 60, 10);

          minutes = minutes < 10 ? "0" + minutes : minutes;
          seconds = seconds < 10 ? "0" + seconds : seconds;

          api.cell(0, 9).data(minutes + ":" + seconds).draw()

          if (--timer < 0) {
              timer = duration;
          }
      }, 1000);
          console.log(api.cell(0, 9).data())
      }

        });

colin

What do you want the timer on each row to do? Should it be moving, or just a fixed time since page load?

Colin