table always active with Ajax and php

Asked

Viewed 288 times

1

I’m studying I’m novice, and I’m making a site with php, jquery and ajax, all blz, I need to load the database data and put it in a table, only the data has to be in real time, that if you have an inclusion in the database the table is updated without giving refresh, Is it possible to do this in ajax? the php part can do everything right my problem is only in js and jquery to precede that this table is loaded, thanks to all.

php mysql ajax

  • You will need to reload the screen and search for the time data in time. You can use https://www.w3schools.com/jsref/met_win_setinterval.asp

1 answer

1


A simple way to do this is by using the resource setTimeout javascript to run a certain function from time to time, creating a loop.

Assuming you have any function to create and display the data table, in this same function you can call it according to the code below determining a time.

setTimeout(funcaoQualquer, 20000); // 20 segundos

See how it works!

var tabelaDados = function () {     
  
  return {
    init: function () {
      console.log('Executando tabelaDados...');
      
      // dados para tabela
      var dataAtual = new Date()
          ,dia  = dataAtual.getDate("dd/mm/YYY")
          ,mes  = dataAtual.getMonth()+ 1
          ,ano  = dataAtual.getFullYear()
          ,hora = dataAtual.getHours()
          ,minuto = dataAtual.getMinutes()
          ,segundo  = dataAtual.getSeconds();

          var table =
          "<table class=\"table table-bordered\">\n" +
          " <thead>\n" +
          "   <tr>\n" +
          "     <th>Data Atual</th>\n" +
          "     <th>Hora</th>\n" +
          "     <th>Minuto</th>\n" +
          "     <th>Segundo</th>\n" +      
          "   </tr>" +
          " </thead>\n" +
          " <tbody>\n" +
          "   <tr>\n" +
          "     <td>"+dia+"/"+mes+"/"+ano+"</td>\n" +
          "     <td>"+hora+"</td>\n" +
          "     <td>"+minuto+"</td>\n" +
          "     <td>"+segundo+"</td>\n" +      
          "   </tr>\n" +
          " </tbody>\n" +
          "</table>\n"; 
      
      //
      $('#example_001').html(table);
      
      //loop 5s
      setTimeout(tabelaDados.init, 5000);      
    }
  }

}(jQuery);
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<div class="col-xs-12 col-sm-12 col-md-12">
  <div class="table table-reponsive" id="example_001">
  </div>
</div>
<script>
jQuery(document).ready(function () {
  console.log('Iniciando...');
  
  tabelaDados.init();
});
</script>

Browser other questions tagged php mysql ajax

You are not signed in. Login or sign up in order to post.