1
I’m having a bit of a complex problem and I hope you can help me.
I have a code that makes a query (Via AJAX and PHP) and fills a table with the return of this query. So far so good. Everything works right.
Being that one of those that are returned in this query, is a button that brings the status of that respective activity of that line .
These Status may be "PENDING", "INITIATED", "COMPLETED". (And each status has a respective color)
Only I made another code that performs an event by clicking this button (which shows the status) that is generated in the query, then the status is changed as well. For example. If the button has the status "PENDING", when clicking on it, the status becomes "STARTED" (Both your HTML code is changed and an UPDATE is also done in the database via AJAX and PHP that changes the status in the Mysql table).
My problem is this: "When I click the button the first time, everything is done right as I want. The button colors are changed, the button text is changed and the UPDATE is done in the database. The problem is when I click again, the button does not change its status again. Then I have to refresh the page with a F5 so I can change the status of the button again. Only I wish I could do it all without having to refresh the page."
For example: If I click the "Pendant" button, it becomes "Started". However, if right after clicking the "Started" button, it does not become "Done". I have to give an F5 to get from "Started" to "Done". I can’t do both requests on the same screen without Refresh
The code is very complex, as much as the explanation I put here. But it was the best way I could explain.
I’ll leave the system image here and also part of the code.
//CÓDIGO PARA PREENCHIMENTO DA LISTA COM OS DADOS DA PESQUISA
$('#formulario-consulta').submit(function(e)
{
e.preventDefault();
var formulario = $(this);
var retorno = inserirFormulario(formulario);
});
function inserirFormulario(dados)
{
$.ajax
({
//dataType: "json",
type:"POST",
data:dados.serialize(),
url:"banco/pagina-minhas-tarefas/interface-resultado-pesquisa.php",
}).done(function(data)
{
var atividades = "";
$.each($.parseJSON(data), function(chave, valor)
{
//FUNÇÃO PARA FORMATAR AS DATAS QUE VEM DO PHP
function dataAtualFormatada(parametro)
{
if(parametro == null)
{
parametro = "";
return parametro;
}
else
{
var data = new Date(parametro),
dia = data.getDate().toString(),
diaF = (dia.length == 1) ? '0'+dia : dia,
mes = (data.getMonth()+1).toString(), //+1 pois no getMonth Janeiro começa com zero.
mesF = (mes.length == 1) ? '0'+mes : mes,
anoF = data.getFullYear();
return diaF+"/"+mesF+"/"+anoF;
}
}
var vencimento = dataAtualFormatada(valor.DT_VENCIMENTO);
var inicio = dataAtualFormatada(valor.DT_INICIO);
var fim = dataAtualFormatada(valor.DT_FIM);
atividades += '<tr id="'+ valor.codigo +'">';
//atividades += '<td>' + valor.codigo + '</td>';
atividades += '<td>' + valor.COD + '</td>';
atividades += '<td>' + valor.EMPRESAS + '</td>';
atividades += '<td>' + valor.TRIBUTACAO + '</td>';
atividades += '<td>' + valor.TIPO_ATIVIDADE + '</td>';
atividades += '<td>' + vencimento + '</td>';
atividades += '<td>' + inicio + '</td>';
atividades += '<td>' + fim + '</td>';
//atividades += '<td><button class="btn-warning" value="'+ valor.codigo +'">Detalhes</button></td>';
if(valor.STATUS == "INICIADO")
{
atividades += '<td><button type="button" class="btn '+ valor.STATUS +'" style="background-color: ForestGreen; color:white; font-weight: bold" value="'+ valor.codigo +'">'+ valor.STATUS +'</button></td>';
}
else if(valor.STATUS == "CONCLUIDO")
{
atividades += '<td><button type="button" class="btn '+ valor.STATUS +'" style="background-color: DodgerBlue; color:white; font-weight: bold" value="'+ valor.codigo +'">'+ valor.STATUS +'</button></td>';
}
else if(valor.STATUS == "PENDENTE")
{
atividades += '<td><button type="button" class="btn '+ valor.STATUS +'" style="background-color: DarkOrange; color:white; font-weight: bold" value="'+ valor.codigo +'">'+ valor.STATUS +'</button></td>';
}
atividades += '</tr>';
});
$('#registros-atividades').html(atividades);
//CÓDIGO PARA QUANDO CLICAR NA LINHA DA TABELA <TR> QUE ESTÁ DENTRO DA <TABLE>
$('#registros-atividades tr').click(function(e)
{
e.preventDefault();
var botao = $(this).attr('id');
$("input[name='codigo-modal-observacoes']").val(botao);
//Código para tirar e remover background no tr ao clicar nele
$(this).siblings().removeClass('ativo');
$(this).toggleClass('ativo');
var retorno = pesquisarDetalhes(botao);
});
//CÓDIGO PARA PREENCHIMENTO DA LISTA COM OS DADOS DA PESQUISA
$('#inserir-observacoes').submit(function(e)
{
e.preventDefault();
var formulariodetalhes = $(this);
var retorno = inserirDetalhes(formulariodetalhes);
});
//CÓDIGO PARA QUANDO CLICAR NOS BOTÕES, ELES ALTERAREM SUA COR, TEXTO E CONSULTA AO BANCO
//CÓDIGO PARA QUANDO CLICAR NO BOTÃO 'PENDENTE' ELE VIRAR 'INICIADO' (NO TEXTO, COR DO BOTAO E NO BANCO DE DADOS)
$(document).on("click","button#PENDENTE", function(e)
{
$(this).html('INICIADO');
$(this).css('background-color','ForestGreen');
var estate = "INICIADO";
var codigo = $(this).val();
$.ajax
({
url:"banco/pagina-minhas-tarefas/mudarstatus.php",
type:"POST",
data:{estate:estate , codigo:codigo},
async:false
}).done(function(data)
{
}).fail(function()
{
});
});
//CÓDIGO PARA QUANDO CLICAR NO BOTÃO 'INICIADO' ELE VIRAR 'CONCLUIDO' (NO TEXTO, COR DO BOTAO E NO BANCO DE DADOS)'
$(document).on("click","button#INICIADO", function(e)
{
$(this).html('CONCLUIDO');
$(this).css('background-color','DodgerBlue');
var estate = "CONCLUIDO";
var codigo = $(this).val();
$.ajax
({
url:"banco/pagina-minhas-tarefas/mudarstatus.php",
type:"POST",
data:{estate:estate , codigo:codigo},
async:false
}).done(function(data)
{
}).fail(function()
{
}).always(function()
{
});
});
//CÓDIGO PARA QUANDO CLICAR NO BOTÃO QUE ESTÁ DENTRO DO <TD> DA <TABLE>
$('#registros-atividades tr td button').click(function(e)
{
e.preventDefault();
var botao = $(this).attr('id');
});
}).fail(function()
{
});
}
function pesquisarDetalhes(dados)
{
$.ajax
({
type:"POST",
data:{botao:dados},
url:"banco/pagina-minhas-tarefas/interface-consulta-comentarios.php",
async:false
}).done(function(retornodobanco)
{
var detalhes = "";
var feedback = "";
$.each($.parseJSON(retornodobanco), function(chave, valor)
{
if(valor.DETALHES == null)
{
info = "Não Possui Observações";
detalhes = "<p>" + info + "</p>";
}
else
{
detalhes = "<p>" + valor.DETALHES + "</p>";
}
if(valor.FEEDBACK == null)
{
info2 = "Não Possui Feedback";
feedback = "<p>" + info2 + "</p>";
}
else
{
feedback = "<p>" + valor.FEEDBACK + "</p>";
}
});
$('#espaco-detalhes').html(detalhes);
$('#espaco-feedback').html(feedback);
}).fail(function()
{
}).always(function()
{
});
}
// --------- FUNÇÃO ------------------- //
function inserirDetalhes(parametro)
{
$.ajax
({
dataType: "html",
type:"POST",
data:parametro.serialize(),
url:"banco/pagina-minhas-tarefas/inserir-observacoes.php",
}).done(function(data)
{
alert(data);
}).fail(function()
{
}).always(function()
{
});
}?php
//CHAMANDO O ARQUIVO DE CONEXÃO COM O BANCO DE DADOS
require_once("banco/conexao/conexao-com-banco.php");
$user = $_SESSION["nome"];
?>
<?php
//Consultas ao banco de dados
require_once("banco/pagina-minhas-tarefas/interface-consulta-banco.php"); // CHAMANDO ARQUIVO DE CONSULTA AO BANCO PARA PREENCHER OS CAMPOS "AUTOMATICAMENTE" DO FORMULÁRIO DE PESQUISA COM INFORMAÇÕES DO USUÁRIO
?>
<?php
require_once("banco/pagina-minhas-tarefas/prencher-dashboard.php");
?>
<!DOCTYPE html>
<html>
<head>
<title>Sistema - JCA</title>
<meta http-equiv="X-UA-Compatible" content="IE-edge">
<meta name="viewport" content="width=devide-width, initial-scale=1">
<link href="_css/pagina-minhas-tarefas/estilo-minhas-tarefas.css" rel="stylesheet"> <!-- ARQUIVO CSS DESTA PÁGINA -->
<link href="_css/menu/estilo-menus.css" rel="stylesheet"> <!-- ARQUIVO CSS DESTA PÁGINA -->
<link href="_bootstrap4.1.1/css/bootstrap.min.css" rel="stylesheet"> <!-- ARQUIVO CSS DO BOOTSTRAP -->
</head>
<body>
<?php
require_once("dashboard/menus.php");
?>
<div class="container-fluid">
<div class="row" id="row-resultados-dashboard">
<div class="col-lg-10 col-lg-offset-2" id="resultados-dashboard">
<div class="col-lg-2 .relatorios" id="resultados-pendentes">
<?php
while($linha_pendentes = mysqli_fetch_assoc($lista_pendentes))
{
?>
<h1>
<?php echo $linha_pendentes['count(codigo)']; ?>
</h1>
<?php
}
?>
<p style="font-size: 90%">Pendentes</p>
</div>
<div class="col-lg-2 .relatorios" id="resultados-iniciados">
<?php
while($linha_iniciados = mysqli_fetch_assoc($lista_iniciados))
{
?>
<h1>
<?php echo $linha_iniciados['count(codigo)']; ?>
</h1>
<?php
}
?>
<p style="font-size: 90%">Em Andamento</p>
</div>
<div class="col-lg-2 .relatorios" id="resultados-iniciados-vencidos">
<?php
while($linha_iniciados_vencidos = mysqli_fetch_assoc($lista_iniciados_vencidos))
{
?>
<h1>
<?php echo $linha_iniciados_vencidos['count(codigo)']; ?>
</h1>
<?php
}
?>
<p style="font-size: 80%">Em Andamento / Fora do Prazo</p>
</div>
<div class="col-lg-2 .relatorios" id="resultados-vencidos">
<?php
while($linha_vencidos = mysqli_fetch_assoc($lista_vencidos))
{
?>
<h1>
<?php echo $linha_vencidos['count(codigo)']; ?>
</h1>
<?php
}
?>
<p style="font-size: 90%">Fora do Prazo</p>
</div>
<div class="col-lg-2 .relatorios" id="resultados-concluidos">
<?php
while($linha_concluidos = mysqli_fetch_assoc($lista_concluidos))
{
?>
<h1>
<?php echo $linha_concluidos['count(codigo)']; ?>
</h1>
<?php
}
?>
<p style="font-size: 90%">Concluidos</p>
</div>
<div class="col-lg-2 .relatorios" id="resultados-concluidos-vencidos">
<?php
while($linha_concluidos_vencidos = mysqli_fetch_assoc($lista_concluidos_vencidos))
{
?>
<h1>
<?php echo $linha_concluidos_vencidos['count(codigo)']; ?>
</h1>
<?php
}
?>
<p style="font-size: 85%">Concluidos Fora do Prazo</p>
</div>
</div>
</div>
<div class="row" id="row-pesquisa">
<!-- INÍCIO DA DIV COM O FORMULÁRIO DE PESQUISA -->
<div class="col-lg-12" id="pesquisa">
<form id="formulario-consulta"> <!-- FORMULÁRIO DE PESQUISA -->
<div class="form-inline">
<div class="row">
<div class="col-lg-10 col-lg-offset-2">
<div class="col-lg-4 form-group">
<h5>Filtrar:</h5>
<div class="radio">
<select name="prioridade" id="prioridade" class="input-sm form-control">
<option value="Todos" selected>TODOS</option>
<option value="Comum">COMUM</option>
<option value="Extra">EXTRA</option>
<option value="Urgente">URGENTE</option>
</select>
</div>
</div>
<div class="col-lg-2 form-group">
<h5>Filtrar por data de:</h5>
<div class="radio">
<select name="data" id="data" class="input-sm form-control">
<option value="inicio">INÍCIO</option>
<option value="finalizacao">FINALIZAÇÃO</option>
<option value="vencimento" selected>VENCIMENTO</option>
</select>
</div>
</div>
<div class="col-lg-6 form-group">
<h5>Filtrar por período:</h5>
De: <input type="date" name="dataInicial" id="dataInicial" class="input-sm form-control" style="width:40%;">
Até: <input type="date" name="dataFinal" id="dataFinal" class="input-sm form-control" style="width:40%;">
</div>
</div>
</div>
<div class="row">
<div class="col-lg-10 col-lg-offset-2">
<div class="">
<div class="col-lg-1 form-group">
<div class="radio">
<h5>COD</h5>
<select name="cod" id="cod" class="input-sm form-control">
<option></option>
<?php
while($linha_cod = mysqli_fetch_assoc($lista_cod))
{
?>
<option id="<?php echo $linha_cod['EMPRESAS'];?>" value="<?php echo $linha_cod["COD"];?>">
<?php echo $linha_cod["COD"]; ?>
</option>
<?php
}
?>
</select>
</div>
</div>
<div class="col-lg-3 form-group">
<div class="radio">
<h5>Empresa</h5>
<select name="empresas" id="empresas" class="input-sm form-control" style="width: 100%">
<option></option>
<?php
while($linha_empresas = mysqli_fetch_assoc($lista_empresas))
{
?>
<option id="<?php echo $linha_empresas['COD'];?>" value="<?php echo $linha_empresas["EMPRESAS"];?>">
<?php echo $linha_empresas["EMPRESAS"];?>
</option>
<?php
}
?>
</select>
</div>
</div>
<div class="col-lg-2 form-group">
<div class="radio">
<h5>Tributação</h5>
<select name="tributacao" id="tributacao" class="input-sm form-control">
<option></option>
<?php
while($linha_tributacao = mysqli_fetch_assoc($lista_tributacao))
{
?>
<option value="<?php echo $linha_tributacao["TRIBUTACAO"];?>">
<?php echo $linha_tributacao["TRIBUTACAO"];?>
</option>
<?php
}
?>
</select>
</div>
</div>
<div class="col-lg-2 form-group">
<div class="radio">
<h5>Atividade</h5>
<select name="atividade" id="atividade" class="input-sm form-control">
<option></option>
<?php
while($linha_atividade = mysqli_fetch_assoc($lista_atividade))
{
?>
<option value="<?php echo $linha_atividade["TIPO_ATIVIDADE"];?>">
<?php echo $linha_atividade["TIPO_ATIVIDADE"]; ?>
</option>
<?php
}
?>
</select>
</div>
</div>
<div class="col-lg-1 col-lg-offset-1 form-group">
<div class="radio">
<h5>Status</h5>
<select name="status" id="status" class="input-sm form-control">
<option></option>
<?php
while($linha_status = mysqli_fetch_assoc($lista_status))
{
?>
<option value="<?php echo $linha_status["STATUS"];?>">
<?php echo $linha_status["STATUS"]; ?>
</option>
<?php
}
?>
</select>
</div>
</div>
<div class="col-lg-1 col-lg-offset-1 form-group">
<h5>Pesquisar</h5>
<input name="enviar" id="enviar" class="btn btn-sm btn-primary btn-block" type="submit" value="Buscar">
</div>
</div>
</div>
</div>
</div>
</form>
</div>
</div>
<div class="row" id="row-resultado-pesquisa">
<!-- DIV QUE EXIBE O RESULTADO DA PESQUISA DO FORMULÁRIO -->
<div class="col-lg-10 col-lg-offset-2" id="resultado-pesquisa">
<!-- DIV QUE EXIBE AS INFORMAÇÕES DE RETORNO DA CONSULTA -->
<div class="col-lg-12" id="exibicao">
<!-- TABELA QUE EXIBE DINAMICAMENTE COM O PHP OS RESULTADOS DA CONSULTA AO BANCO -->
<table class="table table-bordered table-condensed table-hover" id="resultado-exibicao">
<thead class="">
<tr><!--<th>Código</th>--><th>COD</th><th>EMPRESA</th><th>TRIBUTAÇÃO</th><th>TIPO DE ATIVIDADE</th><th>DT.VENC</th><th>DT.INÍCIO</th><th>DT.FIM</th><th>STATUS</th><!--<th>DETALHES</th>--></tr>
</thead>
<tbody id="registros-atividades">
</tbody>
</table>
</div>
</div>
</div>
<!-- DIV PARA EXIBIÇÃO DO RETORNO DA CONSULTA DOS CAMPOS DETALHES E FEEDBACK -->
<!-- DIV COM OS BOTÕES QUE EXECUTAM AÇÕES NO BANCO -->
<div class="col-lg-10 col-lg-offset-2" id="botoes-detalhes-feedback">
<a class="btn btn-md btn-primary" href="#" data-toggle="modal" data-target="#modal-observacoes">Inserir Observações</a></button>
<a class="btn btn-md btn-success" href="#" >Reabrir Atividades</a></button>
<!--<button class="btn btn-md btn-danger"><a href="#" data-toggle="modal" data-target="#modal-reabrir-atividades">Sem Movimento/Arquivo</a></button>-->
</div>
<div class="modal" tabindex="-1" id="modal-observacoes">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header bg-success">
<button class="close"
aria-label="close"
data-dismiss="modal">
<span aria-hidden="true">×</span>
</button>
<h4 class="modal-title">Inserir Observações na Atividade</h4>
</div>
<div class="modal-body bg-success">
<form id="inserir-observacoes">
<div class="form-group col-lg-12" style="font-size: 120%">
<label for="observacoes-modal">Observações - Máximo de 500 caracteres</label>
<textarea class="form-control" name="observacoes-modal" id="observacoes-modal" style="resize: none" rows="4" maxlength="500" required></textarea>
</div>
<input type="text" name="codigo-modal-observacoes" id="codigo-modal-observacoes">
<input type="submit" class="btn btn-primary" name="enviar-modal-observacoes" id="enviar-modal-observacoes" value="Inserir">
</form>
<!--
<div id="confirmacao-inserir-informacoes">
<h4></h4>
</div>
-->
</div>
</div>
</div>
</div>
</div>
</div>
<!-- SCRIPTS -->
<script src="_jquery/jquery-3.2.1.min.js"></script> <!-- ARQUIVO JQUERY -->
<script src="_bootstrap4.1.1/js/bootstrap.min.js"></script>
<script src="_scripts/script-pagina-interface/interface-script.js"></script>
</body> <!-- FIM DO BODY -->
</html> <!-- FIM DO HTML -->
<?php
// Fechando Conexão
mysqli_close($conecta);
?>
<!-- ARQUIVO MUDARSTATUS.PHP (QUE FAZ A ALTERAÇÃO DO STATUS NO BANCO -->
<?php
date_default_timezone_set('America/Sao_Paulo');
// CHAMANDO O ARQUIVO DE CONEXÃO AO BANCO
require_once("../conexao/conexao-com-banco.php");
//CONSULTA NO BANCO QUE MUDA O STATUS NO BANCO DE DADOS
session_start();
$usuario = $_SESSION["nome"];
$estate = $_POST['estate'];
$codigo = $_POST['codigo'];
$data = date("Y-m-d H:i:s");
if($estate == 'INICIADO')
{
$alterarStatus = "UPDATE tbl_atividades set STATUS = '$estate', DT_INICIO = '$data' WHERE codigo = '$codigo'";
}
else if($estate == 'CONCLUIDO')
{
$alterarStatus = "UPDATE tbl_atividades set STATUS = '$estate', DT_FIM = '$data' WHERE codigo = '$codigo'";
}
$resultado_update = mysqli_query($conecta, $alterarStatus) or die("ERRO na conexão com banco de dados");
unset($_SESSION);
?>
<!-- ARQUIVO INTERFACE-RESULTADO-PESQUISA.PHP (REALIZA A CONSULTA E O PREENCHIMENTO DA TABELA -->
<?php
require_once("../conexao/conexao-com-banco.php"); // CHAMANDO O ARQUIVO DE CONEXÃO AO BANCO
session_start();
//PREENCHE AS VARIÁVEIS COM OS DADOS VINDOS DOS CAMPOS DO FORMULÁRIO
$pegaropcao = $_POST["prioridade"];
$tipodedata = $_POST["data"];
$dataInicial = !empty($_POST["dataInicial"]) ? $_POST["dataInicial"] : null;
$dataFinal = !empty($_POST["dataFinal"]) ? $_POST["dataFinal"] : null;
$cod = $_POST["cod"];
$empresas = !empty($_POST["empresas"]) ? $_POST["empresas"] : "";
$tributacao = !empty($_POST["tributacao"]) ? $_POST["tributacao"] : "";
$atividade = !empty($_POST["atividade"]) ? $_POST["atividade"] : "";
$status = $_POST["status"];
$responsavel = $_SESSION["nome"];
//IF PARA VERIFICAR POR QUAL TIPO DE DATA O BANCO IRÁ FILTRAR
if (!is_null($dataInicial) AND !is_null($dataFinal))
{
if($tipodedata == "vencimento")
{
$variavel = " AND DT_VENCIMENTO BETWEEN '$dataInicial' AND '$dataFinal' ORDER BY DT_VENCIMENTO";
}
else if ($tipodedata == "finalizacao")
{
$variavel = " AND DT_FIM BETWEEN '$dataInicial' AND '$dataFinal' ORDER BY DT_FIM";
}
else if($tipodedata == "inicio")
{
$variavel = " AND DT_INICIO BETWEEN '$dataInicial' AND '$dataFinal' ORDER BY DT_INICIO";
}
}
else if (is_null($dataInicial) AND is_null($dataFinal))
{
$variavel = " ORDER BY DT_VENCIMENTO asc";
}
//REALIZA A CONSULTA NO BANCO DE DADOS COM OS DADOS VINDOS DO FORMULÁRIO
if($status == "CONCLUIDO_VENCIDO" OR $status == "INICIADO_VENCIDO" OR $status == "VENCIDO")
{
$pesquisar = "SELECT COD, EMPRESAS, TRIBUTACAO, TIPO_ATIVIDADE, STATUS, DETALHES, FEEDBACK, DT_VENCIMENTO, DT_INICIO, DT_FIM, codigo FROM tbl_atividades";
$pesquisar .= " WHERE COD like '%$cod' AND EMPRESAS like '%$empresas' AND TRIBUTACAO like '%$tributacao' AND TIPO_ATIVIDADE like '%$atividade' AND RESPONSAVEL = '$responsavel' AND STATUS = '$status' $tipodeatividade $variavel";
}
else
{
$pesquisar = "SELECT COD, EMPRESAS, TRIBUTACAO, TIPO_ATIVIDADE, STATUS, DETALHES, FEEDBACK, DT_VENCIMENTO, DT_INICIO, DT_FIM, codigo FROM tbl_atividades";
$pesquisar .= " WHERE COD like '%$cod' AND EMPRESAS like '%$empresas' AND TRIBUTACAO like '%$tributacao' AND TIPO_ATIVIDADE like '%$atividade' AND RESPONSAVEL = '$responsavel' AND STATUS like '%$status' $tipodeatividade $variavel";
}
$operacao_consulta = mysqli_query($conecta, $pesquisar) or die("Erro na conexão com banco de dados");
$retorno = array();
while($linha = mysqli_fetch_object($operacao_consulta))
{
$retorno[] = $linha;
}
echo json_encode($retorno);
?>I know it’s going to be very difficult for you to help me because the problem is very particular and complex. I’ve wiped down enough code to fit him here in Stake. But from now on, thank you. Thank you!
As far as I’ve seen from your code, all your buttons that have the same status keep the same ID. Use a single ID if you need to "generalize" the button event pass this selector as a class or the onclick event. And I also think you could wipe that code a little thinner with what’s really pertinent, or better thought out
– JrD
A quick test... go to the top of the list and click on the second "pending" element and see if any will change.
– JrD
I’ve done something similar here and it seems very easy, in reality the ideal would be that after the execution of ajax the page was updated there would show the change live
– Vinicius De Jesus
Jrd, thanks. In the rush to make the code, I forgot about it. I have already corrected and turned all the ID’s into classes. I’ve done this test of clicking on an element, but really only one is changed. Because I made this condition based on the code, which is the button value.
– Gato de Schrödinger
@Viniciusdejesus, but then in the case of the page update, the table that was loaded as a result of a php search, would disappear. The idea of using AJAX is just that, not changing the page.
– Gato de Schrödinger
@Thiagopetherson If you can edit the code here at SOPT as well... When you click on the button you will also have to change the class of this button to the new class, I imagine it will solve your problem :)
– JrD