Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Creedence

Consulta a banco de dados via JQuery

Recommended Posts

Boa noite !

 

Estou tentando gerar um primeiro código em JQuery com acesso a banco de dados e como não está rolando, gostaria de alguma orientação pra poder dar sequencia.

Tenho o arquivo detalhes.html que tem uma DIV (detalhes), iniciando com display none e que deve mostrar o resultado da consulta. Tem um link (linkdetalhe) que ao ser clicado chama o arquivo JS que iniciaria o processo de consulta ao banco através de detalhes.php.

Estou passando um parâmetro fixo por enquanto para testar (id=2).

O que eu preciso é que o JS passasse o parâmetro para o php e o resultado do php fosse o conteúdo da minha DIV.

Não sei se ficou claro.

Esse modelo eu montei baseado em consultas na Web..

Obrigado,

 

Marcos

 

*****************************

 

detalhes,html

<!DOCTYPE html>
<html>
<head>
  <title></title>

  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
  <script type="text/javascript" src="detalhes.js"></script>

  </head>

  <style>
  .detalhes {
    display: none;
  }
  </style>

<body>
<p>
   Pedidos:<br>
   Codigo: 001<br>
   Data: 04/04/2016<br>
   Valor: R$ 1.050,00 <p>
   
   <a class="linkdetalhe" href="#">Detalhes pedido</a>
      
<div class="detalhes">

</div>   

</bodY>  
</html>

detalhes.js

$(document).ready(function(){
  $( ".linkdetalhe" ).click(function() {
        $.post("detalhes.php",{id:'2'},
            function(data){
            $(".detalhes]").html();
            $(".detalhes]").css(("display", "show");			
        })
  });
});

detalhes.php

<?php

include('includes/conecta.php');

$id = $_POST['id'];

$sql = mysqli_query($conecta, "SELECT * FROM pedidositens WHERE codpedido = '$id'");

while ($consulta=mysqli_fetch_array($sql)) {
	echo "Descricao: ".$consulta['descprod']."<br>";
	echo "Valor    : ".$consulta['valorprod']."<p>";		
}

?>

Compartilhar este post


Link para o post
Compartilhar em outros sites

Três coisas:

 

  1. O parâmetro id que passas para a página detalhes.php não deveria ser numérico?
  2. Na função de retorno (callback) da consulta, a resposta do servidor (variável data) não está a ser usada no código. Suponho que tenha faltado o argumento em $(".detalhes").html(data).
  3. A classe do elemento div chama-se detalhes e tens um ] a mais no código, logo mesmo que haja resposta do servidor, ela não vai ser afixada no sítio certo.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Boa noite !

 

Fiz os ajustes e ainda não está funcionando. Já olhei e dentro do meu (pouco) entendimento da ferramenta não identifiquei erro. Quando clico no link não acontece nada.

Um detalhe: Se eu vou rodar a pagina detalhes.html pelo Firefox com firebug carregado, mostra o erro abaixo:

 

SyntaxError: missing ) after argument list

 

Talvez esse erro já esteja impedindo de rodar o restante do código.

 

Obrigado,

 

Marcos

 

*********************************

 

detalhes.html

<!DOCTYPE html>
<html>
<head>
  <title></title>

  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
  <script type="text/javascript" src="detalhes.js"></script>

  </head>

  <style>
  .detalhes {
    display: none;
  }
  </style>

<body>
<p>
   Pedidos:<br>
   Codigo: 001<br>
   Data: 04/04/2016<br>
   Valor: R$ 1.050,00 <p>
   
   <a class="linkdetalhe"  href='#>Detalhes' pedido</a>
      
<div class="detalhes">

</div>   

</bodY>  
</html>

detalhes.js

$(document).ready(function(){
  $( ".linkdetalhe" ).click(function() {
        $.post("detalhes.php",{id:2},function(data){
            $(".detalhes").html(data);
            $(".detalhes").css(("display", "show");
        });
  });
});

detalhes.php

<?php

include('includes/conecta.php');

$id = $_POST['id'];

$sql = mysqli_query($conecta, "SELECT * FROM pedidositens WHERE codpedido = '$id'");

while ($consulta=mysqli_fetch_array($sql)) {
	echo "Descricao: ".$consulta['descprod']."<br>";
	echo "Valor    : ".$consulta['valorprod']."<p>";		
}

?>

Compartilhar este post


Link para o post
Compartilhar em outros sites

Vamos por partes:

 

Para verificar se há resposta do servidor (i. e., do ficheiro detalhes.php), faz o seguinte:

$.post("detalhes.php",{id:2},function(data){
    console.log(data);
    $(".detalhes").html(data);
    $(".detalhes").css("display", "show");
});

E verifica a consola do browser.

Compartilhar este post


Link para o post
Compartilhar em outros sites

wootzor, boa tarde !

 

Verifiquei mais detalhadamente, baseado inclusive em seu último comentário (e conhecendo melhor também o firebug) que as informações estavam retornando corretamente mas não eram mostradas no html.

Removi a linha do CSS (display:none) do arquivo detalhes.html e também a linha do arquivo detalhes.js (display:show)que eu entendo faria com que a DIV aparecesse.

Agora quando clico no link mostra o resultado da consulta corretamente.

Tudo bem que da pra dar sequencia por enquanto. Mas não sei o que estava errado.

Vou adiantando e tentando descobrir o que ocorre.

 

Obrigado pelo apoio.

 

Marcos

Compartilhar este post


Link para o post
Compartilhar em outros sites

Aproveitando,

 

Meu link Detalhes do Pedido, está dentro de um while, ou seja, ele aparece depois de cada registro da tabela para que eu possa ver detalhes de cada um.

 

Quando eu clico nele, eu gostaria que mostrasse apenas os detalhes daquele pedido clicado .

Nesse meu formato, quando clico ele monta a div com o mesmo html para todos os registros do while e não apenas para o registro que estou posicionado.

 

Att.:

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.