Mostrar conteúdo da div dentro da mesma pagina

[cassio2305 0]

Tudo bem gente?

Vê se vocês podem me ajudar.

Tenho uma listagem de produtos onde aparece a imagem, e o titulo com uma breve descrição.

Ao clicar na imagem, era enviado a id por get e redirecionado a pagina de produto.php?

Mas agora preciso que ao clicar na imagem, uma div se abra mostrando o conteúdo total do produto dentro da mesma pagina.

E ai que eu me atrapalho porque a div da descricao total ta fora da sql inicial que lista os produtos.

Como faço para passar a variavel para a segunda sql?

Ou é melhor fazer de outro jeito completamente diferente?

[icarof 9]

tenta usar uma janela modal e pegar as ids pelo post, ou joga em uma Session e tenta recuperar na modal

[Wesley Santos 28]

Olha esse tutorial: http://tutsmais.com.br/blog/ajax/ajax-com-jquery-enviando-dados-via-ajax/

Ali no $('input[type=submit]').click você pode alterar para o nome de seu botão que busca os dados, e você pode criar os botões com o id do produto que você quer buscar, por exemplo: <button id="id_do_produto">Clique</button>

Ai no seu JS, também cola essa function:

function clique(e){  
    return(e.target.id);  
}  

AI ali no código do ajax, na quinta linha mais ou menos, você chama função:

var id = clique(event);

Pronto, ai ali no ID você tem o ID do botão clicado que é o ID do seu produto, só chamar a página PHP que busca os dados e passar o seu ID.

[VerdenKaf 4]

Acho que você está se referindo a um Collapse, certo?

Seria algo como quando abrir o produto, o restante das informações 'deslizarem' para baixo. Dê uma lida aqui:

http://www.w3schools.com/Bootstrap/bootstrap_collapse.asp

[cassio2305 0]

Obrigado pelas respostas.

Não conhecia janela modal, vou dar uma estudada nela, mas é que pro caso não serviria pro layout.

Vou fazer uns testes com o ajax.

E o efeito é tipo o collapse mesmo.

Pra agora eu consegui "resolver" o problema mudando o script dos botões, se alguem puder me ajudar só pra finalizar isso...

Oque ta faltando nesse script abaixo pra quando um segundo botao for clicado ele feche o conteudo do primeiro e mostre o do segundo e vice-versa.

<script>
$(document).ready(function() {
$(".slidingDiv").hide();
$(".show_hide").click(function(){
		var $str = $(this).attr("id");
		var $index = $str.replace('show_hide', '');
		var divName = "#slidingDiv" + $index;
		
		$(divName).slideToggle(500);
		
	});
});
</script>

PS: Preciso dum curso de javascript urgente.