Carregar div com ajax

[LeDourado 0]

Bom dia !

No meu projeto, tenho uma janela poup-up com 3 botões. Cada um deles deve abrir uma div com resultados específicos de acordo com o botão que o usuário clicar.
O problema é que quando eu clico no botão, nada acontece... já tentei como teste apenas esconder a div principal com o click do primerio botão, porém sem sucesso.

 

Meu código atualmente está assim:

 

js

function mostrartabela(){
			var div = document.getElementById('tabrod');
			div.style.display = 'block';
			$("#funcao").val("pesquisa");
			data = $('#tabrod');
			$.ajax({
				url: "/linkspoupup.php",
				type: "POST",
				timeout: default_timeout,
				data: data
			})
				.done(function() {
					$("#tabela").load("linkspoupup.php #tabrod");
				});
		}

html

div id="page-wrapper">
		<div id="tudo">
			<form class="form-horizontal" method="post" name="formrod" action="/linkspoupup.php" id="formrod">
				<input type="hidden" name="funcao" id="funcao" value="pesquisa"/>
				<div class="text-center" id="menu">
					<h3><input type="button" style="width:50%;" value="Chat" name="chat" id="chat" onclick="mostrartabela();"/></h3><br><br>
					<h3><input type="button" style="width:50%;" value="Email" name="email" id="email"/></h3><br><br>
					<h3><input type="button" style="width:50%;" value="Telefone" name="telefone" id="telefone"/></h3>
				</div>
			</form>
		</div>
		<div id="tabela"></div>
		<table name="tabrod" id="tabrod" class="table table-bordered table-hover center-text" style="background-color: #ffffff;" style="display: none;"></table>
	</div>

e php

$funcao = postget('funcao');

if($funcao == 'pesquisa') {
	$codigo = get('codigo');
	$codcliente = get('codigo');

	$chat = postget('chat');
	$email = postget('email');
	$telefone = postget('telefone');
	?>
	<table name="tabrod" id="tabrod" class="table table-bordered table-hover center-text" style="background-color: #ffffff;">
		<thead align="center">
		<tr class="danger">
			<th>ID</th>
			<th>Nome</th>
			<th>Email</th>
		</tr>
		</thead>
		<tbody>
		<?
		$sql = "select codcliente, nome, email from cliente where codempresa=8 order by codcliente limit 5;";
		$rst = my_query($connR, $sql);

		foreach ($rst as $row) {
			?>
			<tr>
				<td align="center"><?= $row['codcliente'] ?></td>
				<td align="center"><?= $row['nome'] ?></td>
				<td align="center"><?= $row['email'] ?></td>
			</tr>
		<?
		}?>
		</tbody>
	</table>
<?}?>

Alguem pode me ajudar? Obrigada

[William Bruno 1501]

Bom Dia, isso aqui:

data = $('#tabrod');

não faz sentido.

 

Vc está enviando um elemento HTML no ajax.. deveria ser um par: chave -> valor.

Fora isso, o que aparece no console de erros? Ctrl + Shift + J no Firefox ou Chrome.

[LeDourado 0]

Oi Bruno,

 

no console aparece:

 

ReferenceError: mostrartabela is not defined

[William Bruno 1501]

Ok, precisamos resolver o ReferenceError: mostrartabela is not defined primeiro.

 

Você não importou corretamente o script na página. Corrija isso.

 

 

Você pode enviar no ajax qualquer dado no formato: chave -> valor.

[LeDourado 0]

Tenho um arquivos com os scripts que insiro em todas as páginas. Em outras páginas tenho funções ajax que funcionam corretamente... não sei o que esta acontecendo com essa.

 

Mudei a função:

function mostrartabela(){
			var div = document.getElementById('tabrod');
			div.style.display = 'block';
			$("#funcao").val("pesquisa");
			$.ajax({
				url: "/pesquisa_log.php",
				type: "POST",
				timeout: default_timeout,
				data: { chat: $("#chat").val() }
			})
				.done(function() {
					$("#tabela").load("linkspoupup.php #tabrod");
				});
		}

[William Bruno 1501]

Pode ser erro no caminho, cache do navegador.. corrija isso.

Depois disso prosseguimos.

[LeDourado 0]

Obrigada pela ajuda, resolvi com uma modal ^^