1
This code already registers in AJAX and filters the data from the HTML table, check out the code.
HTML
This is a part of the HTML code, where I show the table data
<html>
<head>
<?php include_once 'sidebar.php'; ?>
<?php include_once '../importante/table_header.php'; ?>
<?php include_once '../importante/select_header.php'; ?>
</head>
<body>
<!-- Static Form -->
<form method="post" action="../servidor/c_organizar_crianca.php" id="idForm">
<!-- Tabela -->
<table id="table" data-toggle="table" data-pagination="false" data-search="true" data-show-columns="true" data-show-pagination-switch="true" data-show-refresh="true" data-key-events="true" data-show-toggle="true" data-resizable="true" data-cookie="true"
data-cookie-id-table="saveId" data-show-export="false" data-click-to-select="true" data-toolbar="#toolbar">
<thead>
<tr>
<th data-field="" data-checkbox="false"></th>
<th data-field="id">ID</th>
<th data-field="name" data-editable="false">NOME</th>
<th data-field="idade" data-editable="false">IDADE</th>
</tr>
</thead>
<tbody>
<?php
$query = "SELECT * FROM crianca ORDER BY id ASC";
$ver = Crianca::findBySql(con(), $query);
$query1 = "SELECT * FROM organizar_crianca ORDER BY id ASC";
$view = OrganizarCrianca::findBySql(con(), $query1);
//Faz o controle das crianças que já foram organizadas
for($a = 0;$a<count($view);$a++){$total=$a;}
$pega=0;$a=0;$id = 0;
//id - conta o index do criança
foreach ($ver as $i):
$id++;$pega=0;$a=0;
foreach ($view as $i1){
if($i1->getCriancaId() == $i->getId()){$pega=1;}
if($pega!=1 && $total == $a ){
?>
<tr>
<td> <input type="checkbox" name="seleciona[]" value="<?php echo $i->getId() ?>" > </td>
<td data-name="id"><?php echo $i->getId() ?></td>
<td data-name="nome"><?php echo $i->getNome() ?></td>
<td data-name="idade"><?php echo $i->getIdade() ?></td>
</tr>
<?php
}$a++; }endforeach;
?>
</tbody>
</table>
<!--END Tabela -->
</form>
</body>
</html>
PHP
THIS IS PHP WHERE I REGISTER THE DATA
<?php
//Conecta com a base de dados
include_once 'conectar.php';
$educador = $_POST['s_educador'];
$turma = $_POST['s_turma'];
$sala = $_POST['s_sala'];
//Verifica se foi selecionado um educador
if(!empty($educador)){
//Verifica se foi selecionado uma criança
if(isset($_POST['seleciona'])){
$selecionado = $_POST['seleciona'];
//Pega o total das crianças selecionadas
for($a = 0;$a<count($selecionado);$a++){$total=$a;}
//Cadastra as crianças selecionadas
for($i = 0;$i<count($selecionado);$i++){
$selecionar = $selecionado[$i];
$organizar = new OrganizarCrianca();
$organizar->setFuncionarioId($educador);
$organizar->setCriancaId($selecionar);
$organizar->setTurmaId($turma);
$organizar->setSalaId($sala);
if(!$organizar->insertIntoDatabase(con())){
//Erro ao cadastro
returnAjax($r, '1');
}else{
if($total == $i){
//Sucesso ao cadastro
returnAjax($r, '0');
}
}
}
}else{
//Por favor seleciona uma criança
returnAjax($r, '2');
}
}else{
//Por favor seleciona um educador
returnAjax($r, '3');
}
?>
AJAX
AND THIS IS THE AJAX SCRIPT
<script>
function submeterOrganizar(idForm){
//frm -> pega o id do formulário, para ter o acesso a todos os conteúdo do formulario (metodo,acção...).
let frm = $('#'+idForm);
//Quando o formulário for submetido será executado automaticamente
frm.submit(function(e){
//e -> é usado para impedir que o formulário será submetido de forma normal.
//preventDefault() -> impedi a submetido tradicional.
e.preventDefault();
//Evitando que barbarizão o formulário de cadastro
if($("#enviar").val() === "Enviando..."){
return false;
}
$("#enviar").val("Enviando...");
$.ajax({
dataType:'json',
type: frm.attr('method'),
url: frm.attr('action'),
data: frm.serialize(),
cache: false,
//Verificações
beforeSend: function(){
progresso();
},
success: function(i){
if(i.numero === '0'){
$("#enviar").val("...");
//sucesso do cadastro
//sucesso();
alert("sucesso do cadastro");
vazio();
}else if(i.numero === '1'){
//erro();
$("#enviar").val("...");
alert("Erro do cadastro");
vazio();
}else if(i.numero === '2'){
//erro_espaco();
$("#enviar").val("...");
alert("Por favor seleciona uma criança");
vazio();
}else if(i.numero === '3'){
//erro ao cadastrar
$("#enviar").val("...");
alert("Por favor seleciona um educador");
vazio();
}
},
//erro do Ajax
error: function(){
//alert("Numero = "+i.numero);
alert("Surgiu um erro...");
//vazio();
}
});
});
}
/*------------------------------- Area do alert ------------------------------------------*/
//Mostra o alerta sucesso
/*
function sucesso(){document.getElementById("basicSuccessAnimation").click();}
//Mostra o alerta erro
function erro(){document.getElementById("basicErrorAnimation_usuario").click();}
function erro_espaco(){document.getElementById("basicErrorAnimation_usuario_espaco").click();}
*/
//Progresso
function progresso(){document.getElementById("progresso").src="../../img/progresso/loading1.gif";}
function vazio(){document.getElementById("progresso").src="";}
</script>
You already tried on the return of ajax, take the uploaded data and create a new row in the table using jquery append?
– Guto Xavier
Already, it worked out thanks for the help.
– Wyllionceto