Agreagar setinterval to row datatables

Question

Agreagar setinterval to row datatables

Navigation

#1 by (1 votes)
#2 by (0 votes)

0

How could I integrate a setinterval of 1 sec to this:

<div class="table-responsive">
<table id="listado" class="table table-striped">
 <thead>
  <tr>
   <th>N° PROCESO</th>
   <th>TECNICO</th>
   <th>FECHA ENT. INTERNA</th>
   <th>PROCESO</th>
  </tr>
 </thead>
</table>
</div>
<script>
$(document).ready(function() {
var table = $('#listado').DataTable({
"ajax":{
  "method":"GET",
  "data": {idped: <?php echo $idped?>, etp : <?php echo $etapa?>, folio : <?php echo $fol?>},
  "url" : url.php',
},
"columns" : [
{
          "sClass": "alignRight",
          "data" : "folio"
        },{
          "sClass": "alignRight",
          'data' : null,
           'render': function (data, type, row, meta) {
            var nom = row['nombres'];
            var ape = row['apellidos'];
            return ''+nom+'&nbsp;'+ape+'';
           }
        },{
      <!-------- AQUI NECESITO EL SETINTERVAL --------->
        "sClass": "alignRight",
        "data" : "fecha_tope",
        "render": function (data) {
        var now = new Date().getTime();
            return moment(now).countdown(data).toString();
         }
       <!--------------------------------------------------->
        },{
        "sClass": "alignRight",
        "data" : "nom_etapa"
        }
      ],

      "order": [
        [0, 'asc']
      ],
      "iDisplayLength": 25,
      "language": {
          "emptyTable": "SIN REGISTROS",
          "infoEmpty": "",
          "search": "Buscar _INPUT_ ",
          "info": "Mostrando Pagina _PAGE_ de _PAGES_",
          "lengthMenu": "Mostrando _MENU_ Registros",
          "infoFiltered": "(Busqueda Desde _MAX_ Registros Totales)",
          "paginate": {
            "next": "Siguiente",
            "previous": "Anterior"
          }
      },

    });

});
the code makes a countdown with moment.js and shows it to me in days, hours, minutes and seconds, but I need to update every 1 sec just that row and not a complete table to make it look like a counter clock (count down). Any ideas? Greetings and thanks.

javascript datatables setinterval

asked by maha1982 21.11.2018 в 21:13

source

2 answers

0

This would more or less be what you need, but if you want to cancel it you should save the setInterval in a variable.

"render": function (data) {
       var now = new Date().getTime();
       return setInterval(function(){
          return moment(now).countdown(data).toString();
       }, 1000);
     }

answered by 21.11.2018 в 21:52

How to validate the time format in the 12 hour format? [closed] Problem with ajax form

score 1 · Accepted Answer

In your html you must place an id in that cell to be able to select it:

<td><span id='demo' class="changemade"></span></td>

Then in the datatables initialize that cell:

"render": function (data) {
       return  new Date().getTime();  
 }

Finally in the ready you raise the interval and in each execution you explore all the rows and do the calculation in each cell:

$(document).ready(function() {
idInterval=setInterval(function(){
    table.column( 0 ).data().each( function ( value, index ) {
            var valor = document.getElementById('demo').innerHTML;
            var x = moment(valor).subtract(1, 'seconds');//Resto el segundo
            $(".changemade").html(x._d);
            //Estas dos actualizan el datatables
            var UpdateTD = $(".changemade").parent('td');
            table.cell( UpdateTD ).data( UpdateTD.html()).draw();
        } );
}, 1000);    
$( '.changebutton' ).on( 'click', function () {
    clearInterval(idInterval);
}); 
});

Add a button to stop the setInterval . If you use a class the function each does not make sense but all the cells will have the same value. If you use id all the cells will have their own value but you have to use each. link