Usando Ajax com PHP

Olá pessoal!

Estou fazendo um sistema como exercício usando o PHP e o problema que estou enfrentando é o seguinte:

Tenho uma tabela (<table>) com quase todos os dados da tabela produto contida no MySQL.

Para mostrar todos os campos, a tabela (<table>) ficou pequena, então tive a ideia de que em cada linha (tr) da tabela irá ter um ícone que ao clicar abre uma janela (div) para mostrar todos os campos com mais espaço e detalhes, e por conseguinte um botão de fechar esta janela, já que fiz um esquema tipo modal nela.

Para isso estou usando o jQuery.

Até ai tudo bem, o problema está em mostrar os dados que estava na exata linha que eu cliquei, para isso preciso de alguma forma recuperar o campo "pro_id" para posteriormente fazer a pesquisa SQL. Contornei este problema com uma gambiarra:

<img src="blablalba.png" id="<?php echo $r['pro_id']?>" />

 

Ai lá no arquivo javascript, com ajuda do jQuery ficou assim:

var item = $(this).attr("id"); // logo item recebe o valor da coluna pro_id

$("#div-do-ajax").load("ajax/arquivo.php?item=" + item);

 

Desta forma, a variável item eu recupero pelo $_GET['item'] na página que o método load() carregar.

Após isso tenho em mãos o ID de onde cliquei lá na tabela (<table>) mas tento usar a função de select contida num arquivo php importado (require) la no index, mas creio que o php destrói variáveis etc após o carregamento.

Resumindo, qual é o jeito correto e mais inteligente de fazer isso que estou tentando, eheheheh, porque desta forma está virando uma salada que daqui a pouco nem eu entendo mais. Quero clicar no ícone em uma linha e as informações referente à esta linha serem apresentadas em uma caixa, como um lightbox que mostra fotos ampliadas, por exemplo.

Meu amigo, seguinte, eu faço da seguinte forma.

Crie uma div tipo
<div id="conteudo"></div>

Faça uma função jquery para buscar os valores que quer e já trazê-los dentro da tabela, eu particularmente não uso table, uso só div.

Por exemplo, o arquivo que vai consultar no banco de dados e montar o html seja o

monta.php
<?php
todo seu código que consulta na tabela e já pode até montar o html aqui
inclusive ponha o id da tr como tr_idproduto
?>

No arquivo index, vai fazer
<script type="text/javascript">
$(document).ready(){
//Buscando o html para jogar na div conteudo
$.get('monta.php').done(function(retorno){
$('#conteudo').html(retorno);
});
//Com isto já estará listado na table, agora vamos fazer a parte de dar o modal na janela

$(document).on('click', 'tr', function(){
var id_produto = $(this).attr('id').split('_')[1]; //Com isto explode o id da tr e pega o objeto na posicao 1, que é o id do produto
window.open(a url do seu arquivo ?idproduto=id_produto);
//E no arquivo que chama acima faça novamente a consulta na base pelo id do produto e monta do jeito que quiser a tela
});
})
</script>

Qualquer dúvida posta ai.

Consegui, coloquei o javascript inline passando o ID como atributo, assim:

<img src"imagem.png" onclick"funcaoJS(<?php echo $r['pro_id]'?>)" />

 

Lembrando que é uma tabela com todos os produtos cadastrados, então cada linha da tabela passará seu ID correspondente.

Na questão no Ajax estou usando o método load() do jQuery mesmo, recuperando o ID passado como atributo da função funcaoJS(id):

$("#div-to-load").load("ajax/ajax.php?item=" + item);

 

Então recupero o ID com o $_GET['item'] em ajax.php..

Enfim, deu tudo certo, e agradeço suas dicas isilver, foram de grande importância!!!

Show de bola.

Eu também usava o Load e colocava as funções jquery no html, porém com o tempo
eu passei a separar o html do jquery, tipo escrevo o html e passo as funções
separadamente tudo via jquery mesmo, e quanto ao load, depois de muitos testes
eu achei melhor ter classes php que geram o html de acordo com os parametros que
eu passar e buscá-los através de $.get passando os parametros necessários
e passando esse resultado para a propriedade html de algum elemento como div.

Esse negócio de separar as linguagens em arquivos é muito importante, por exemplo, um arquivo .php só contém HTML e PHP, um .css apenas CSS, o .js apenas Javascript (jQuery). Eu programo assim, com exceção daquela declaração inline do "onclick=functionJS()" pois neste caso fiquei sem outra escolha.

Todo o CSS que uso está em styles.css assim como o JS está em javascript.js, eu os importo no index.php, dentro da tag head.

O restante fica tudo picado em arquivos PHP, assim, usando o "require_once" monto o site conforme as "clicadas" do usuário, é como brincar de quebra cabeça, rsrsrs

Mas beleza isilver, dou este tópico como resolvido, só nãp sei onde clico para isso, kkk

Abraço!

Mais uma dúvida aproveitando o tópico:

Tenho o arquivo config.php:

<?php

$server   = 'localhost';

$dataBase = 'db_meubanco';

$user     = 'root';

$password = '12345';

?>

 

No arquivo da classe conexão tenho:

<?php

require_once 'config.php';



class Conexao {

  protected $server   = NULL;

  protected $dataBase = NULL;

  protected $user     = NULL;

  protected $password = NULL;



  ...

}

?>

 

A finalidade é ter um arquivo config.php para inserir os dados, sem ser necessário editar o arquivo da classe diretamente, minha dúvida é como inicializar as varíaveis protected de dentro da classe Conexao com os valores passados em config.php?

Assumindo que são variáveis de escopo globais, você pode utilizar uma das variáveis especiais chamada de super globais , a $GLOBAL é referência para as variáveis globais.

$foo = $GLOBAL['server'];

echo $foo



saída:

localhost

 

A melhor maneira, seria tratar tudo como objeto, tirando o ar de macarrão procedural X oo.