Answers

• kthorngren Posts: 21,364Questions: 26Answers: 4,956

  December 2020

  One option might be to use the xhr event and in the event use setTimeout to trigger the next reload.

  Kevin
• luisrortega Posts: 79Questions: 6Answers: 1

  December 2020

  Shut, that might be a cleaner... way...

  setAutoRefresh(dataTable)
  - trap event for xhr
  - create setTimeout
  - on timeout call ajax.reload, then reset setTimeout to call itself...

  I need to figure what to do if there is a communication error (since xhr might not trigger)
• luisrortega Posts: 79Questions: 6Answers: 1

  December 2020

  This is surely not the most beautiful code you will see today... whatever...

  jQuery.fn.extend({
    autoRefresh: function(refreshRate) {
        const refreshData = function (dt){
          $(dt).DataTable().ajax.reload(null, false);
        }
        const fnRefreshData = function (e, settings, json) {
           if (e.target.autoRefreshElement.refreshRate !== 0){
               e.target.autoRefreshElement.interval = setTimeout(refreshData, e.target.autoRefreshElement.refreshRate,e.target);
               $(e.target).one('xhr.dt',fnRefreshData);
           }
        };
  
      return this.each(function(index, eachitem) {
        let item = $(eachitem)[0];
        console.log('test item is...' , item.autoRefreshElement);
        if (!item.autoRefreshElement){
          console.log('new item is...' , item);
        
          item.autoRefreshElement = {
              interval : setTimeout(refreshData, refreshRate, item),
              refreshRate : refreshRate
          }
          $(item).one('xhr.dt',fnRefreshData);
        }
        else{
          console.log('reset item is...' , item);
          item.autoRefreshElement.refreshRate = refreshRate;// set new (for next trigger)
        }
      });
    }
  });
  
  

  to call it.. use...

  $('#tbl-customers-content').autoRefresh(10000)
  

  Thanks,
  Luis
• luisrortega Posts: 79Questions: 6Answers: 1

  December 2020

  Is there a way for me to attach it to DataTables itself? so instead of

  $('#tbl-customers-content').autoRefresh(10000)
  

  we can use...

  $('#tbl-customers-content').DataTables().autoRefresh(10000) 
  
• kthorngren Posts: 21,364Questions: 26Answers: 4,956

  December 2020

  we can use...
  $('#tbl-customers-content').DataTables().autoRefresh(10000)

  No because $('#tbl-customers-content').DataTables() returns an instance of the (Datatables API](https://datatables.net/manual/api#Accessing-the-API) which doesn't have an aPI like autoRefresh().

  Kevin
• luisrortega Posts: 79Questions: 6Answers: 1

  December 2020

  a couple of modifications

  • Validate the object is an actual dataTable by using $.fn.dataTable.isDataTable(item)
  • Extend dataTable object (instead of core JQuery)

  jQuery.fn.dataTable().extend({
    autoRefresh: function(refreshRate) {
        const refreshData = function (dt){
          $(dt).DataTable().ajax.reload(null, false);
        }
  
        const fnRefreshData = function (e, settings, json) {
           if (e.target.autoRefreshElement.refreshRate !== 0){
               e.target.autoRefreshElement.interval = setTimeout(refreshData, e.target.autoRefreshElement.refreshRate,e.target);
               $(e.target).one('xhr.dt',fnRefreshData);
           }
        };
  
      return this.each(function(index, eachitem) {
        let item = $(eachitem)[0];
        if ($.fn.dataTable.isDataTable(item)){
        console.log('test item is...' , item.autoRefreshElement);
        if (!item.autoRefreshElement){
          console.log('new item is...' , item);
        
          item.autoRefreshElement = {
              interval : setTimeout(refreshData, refreshRate, item),
              refreshRate : refreshRate
          }
          $(item).one('xhr.dt',fnRefreshData);
        }
        else{
          console.log('reset item is...' , item);
          item.autoRefreshElement.refreshRate = refreshRate;// set new (for next trigger)
        }
        }
      });
     }
  });
  

  now...

  $('#tbl-customers-content').dataTables().autoRefresh(10000);
  
• luisrortega Posts: 79Questions: 6Answers: 1

  December 2020

  Ups sorry Kevin, I didn't read your message on time... I took the plugin route to use the internal API... I'm not sure if this is future proof, but it works as of now

  Thanks for your help!