Estou fazendo com que uma div com form fique oculta, e usando o AJAX para quando for clicado no botão buscar a div fique visível, e traga o resultado do banco em PHP. Só que simplesmente não consigo colocar meu trecho da div tabela para ser mostrado no AJAX...a lógica do código é..tenho comboBox que fica visível, ao selecionar o valor 'Boletos' ela mostra a div1, selecionando um valor na div1 e clicando no botão buscar ela permanecesse visível e deveria trazer o resultado da div tabela...meu código está assim:
$(document).ready(function() {
$('#div1').hide();
$('#comboBox').change(function() {
if ($('#comboBox').val() == 'Boletos') {
$('#div1').show();
acao = '#form_1';
form = '#div1';
}
$(document).on('click', '.botao', function(e){
e.preventDefault();
$.ajax({
url: acao,
type: "post",
data: $(form).serialize(),
complete: function (response) {
//AQUI ela deveria trazer a minha div TABELA com o resultado do banco
$('#tabela').html(Visibility='visible');
$('#div1').show();
},
error: function () {
$('#tabela').html('Erro, não há resultados');
},
});
});
});
Meu método POST é para fazer todo o processo nesta mesma página.
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<select id="comboBox" name="comboBox">
<option>Selecione sua opção aqui</option>
<option value='Boletos'>Boletos</option>
<option value='Folhas'>Folhas</option>
<option value='Guias'>Guias</option>
</select>
<form action="<?php echo $_SERVER['PHP_SELF'];?>" id="form_1" method="POST">
<div id="#div1">
<select id="combo1" name="combo1">
<option>Selecione sua opção aqui</option>
<option value='Pagamento 1'>Pagamento 1</option>
<option value='Pagamento 2'>Pagamento 2</option>
</select>
<button type="submit" class="botao" id="btn1" value="btn1">Buscar</button>
</div>
</form>
E aqui a minha div TABELA, que deveria estar mostrando o resultado dela no AJAX:
<div id="tabela" class="table table-responsive">
<table class="nome>
<thead>
<tr>
<td><center>Protocolo</center></td>
<td><center>Boleto</center></td>
<td><center>Categoria</center></td>
</tr>
</thead>
<tbody>
<?php
include "conexao.php";
ini_set('max_execution_time', 600);
$categoria = $_POST['combo1'];
$stmt = $db->prepare("select protocolo,nomeBoleto,categoria,hr_dt_inserido from boletos WHERE categoria=$categoria");
$stmt->execute();
while($row = $stmt->fetch()){
if($row > 0){
?>
<tr>
<td><?php echo $row['protocolo']?></td>
<td><?php echo $row['nomeBoleto']?></td>
<td><?php echo $row['categoria']?></td>
</tr>
<?php
}
else{
echo "Não exitem Boletos a serem exibidos";
}
}
?>
</tbody>
</table>
</div>
Eu testei está tudo funcionando a unica coisa que preciso é neste trecho do código AJAX que preciso trazer o resultado da minha div tabela, que ao invés disso traz a palavra 'visible':
complete: function (response) {
//AQUI ela deveria trazer a minha div TABELA com o resultado do banco
$('#tabela').html(Visibility='visible');
$('#div1').show();
},