I'm not able to mount the modal by getting a table using $ ajax . Anyone have any tips?
I'm sending it this way: JS file:
$("html").on('click', "#modalHorariosQuadra", function(){
var idQuadra = parseInt( $(this).val() );
var modalTela = $('#modal');
$.ajax({
type: 'POST',
dataType:'json',
url: '../Ajax/quadraHorariosParaAlugar.php',
data: { idQuadra : idQuadra },
complete: function(retorno){
modalTela.modal('show');
modalTela.find('.modal-title').text('Escolha um horário para fazer sua reserva.');
$('.modal-body').html(retorno);
}
});
});
The modal even appears, however, without the table:
ThePHPfileismountingthetable,thefilereturnsmelikethis:
InthePHPfileIapennasthetable,withoutmuchmystery.
PHPfile:
<?php//INICIAUMANOVASESSÃODEUSUÁRIOsession_start();//VERIFICASEESTÁLOGADOif(!isset($_SESSION["id"])){
// SE O LOGIN NÃO AUTENTICAR
$_SESSION['loginError'] = "<div class='alert alert-danger'>Efetue o login!</div>";
header("Location: ../Index.php");
} else {
// INCLUI A CAMADA CONTROLLER
include_once("C:/xamppNew/htdocs/futamador/Model/Model.php");
$model = new Model();
$idQuadra = $_POST['idQuadra'] ? $_POST['idQuadra'] : null;
$arrayHorarios = $model->conexaoProprietario->buscaHorariosQuadra($idQuadra);
if($arrayHorarios){ ?>
<table class="table table-hover">
<thead>
<tr>
<th scope="col">Hora Inicio</th>
<th scope="col">Hora Fim</th>
<th scope="col">Data</th>
<th scope="col">Ações</th>
</tr>
</thead>
<tbody>
<?php
foreach ($arrayHorarios as $res){
$idHorario = $res['idHorarios'];
$idQuadra = $res['Quadras_idQuadras'];
$horaInicio = $res['horarioInicial'];
$horaFim = $res['horarioFinal'];
$dataDisponivel = $res['dataHorario']; ?>
<tr>
<td><?php echo $horaInicio; ?></td>
<td><?php echo $horaFim; ?></td>
<td><?php echo $dataDisponivel; ?></td>
<td>
<button type="button" id="excluirHorarioProp" class="btn btn-danger btn-sm" value="<?php echo $idHorario; ?>">Excluir</button>
</td>
</tr>
<?php }
?>
<tbody>
</table>
<?php } else {
echo "<div class='alert alert-danger'>Não existe horários cadastrados para esta quadra.";
}
}