0
I would like to know how to automatically update the table with the Jquery load because I tried to put it in the main file and keep breaking the table, so I increased the setInterval time but still it gets weird, could help me?
$(document).ready(function(){
$('#tabela').empty(); //Limpando a tabela
$.ajax({
type:'post', //Definimos o método HTTP usado
dataType: 'json', //Definimos o tipo de retorno
url: 'consulta.php',//Definindo o arquivo onde serão buscados os dados
success: function(dados){
for(var i=0;dados.length>i;i++){
//Adicionando registros retornados na tabela
$('#tabela').append('<tr><td>'+dados[i].id+'</td><td>'+dados[i].nome+'</td><td>'+dados[i].quantidade+'</td></tr>');
}
}
});
});<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<!-- <link rel="stylesheet" href="public/css/style.css"> -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
<script src="public/js/exibi.js"></script>
<!-- O código abaixo mostra como estava fazendo a atualização -->
<!-- <script type="text/javascript">
$(function(){
var refreshAutomatico = setInterval(function(){
$('#tabela').load("teste.php");
}, 10000);
});
</script> -->
</head>
<body>
<table border="1" width="500">
<thead>
<tr>
<th>Id</th>
<th>Nome</th>
<th>Quantidade</th>
</tr>
</thead>
<tbody id="tabela">
</tbody>
</table>
</body>
</html>
An alternative is for your PHP to return the mounted table.
– Kayo Bruno
@Kayobruno might even be, more like it would to keep updating every 5 minutes
– Bruno Ferreira
In that case I advise you to use web socket.
– Kayo Bruno
Create a
<div id="resposta"></div>every 5 min execute an ajax that selects in the bank and in this file print the table, take the answer of the ajax and play with the.append()inside the response div.– Vinicius De Jesus
Create a function that loads the table, and after loading wait for the time needed to recall the function. E.g.: Inside the
$(document).ready(function(){ fnCarregaTabela() });. Inside the ajax sequence, place thesetTimeout(function(){ fnCarregaTabela()() }, 5000),inside the Success, right at the end– adventistaam
But because with the load didn’t work?
– LeAndrade
@Leandrade the way I wrote it works only that it keeps doing the same event as the form when sending that loads the whole page wanted something else that only loaded the data without having the refresh aspect
– Bruno Ferreira