Estou precisando trazer somente os produtos referente a categoria selecionada, quando clico em:
<a class="cat-link" href="javascript:;" title="<?php echo $res['nome_cat']; ?>">
<img style="position:relative; top:50%; transform:translateY(-50%);"
src="img_cate/<?php echo $res['img_cat']; ?>" width="100"
title="<?php echo $res['nome_cat']; ?>" />
</a>
Estou usando o código PHP abaixo,
<?php include "conexao.php"; ?>
<div id="produtos-content">
<!-- Listando os Categorias -->
<?php
$nome_cat = $_POST['nome_cat'];
$img_cat = $_POST['img_cat'];
$query_categoria = mysql_query("SELECT * FROM categoria");
while($res = mysql_fetch_array($query_categoria)){
?>
<div style="float:left; width:112px; height:133px; padding:2px 10px;" id="cats-list">
<a class="cat-link" href="javascript:;" title="<?php echo $res['nome_cat']; ?>">
<img style="position:relative; top:50%; transform:translateY(-50%);"
src="img_cate/<?php echo $res['img_cat']; ?>" width="100"
title="<?php echo $res['nome_cat']; ?>" />
</a>
<div style="background:#2f2140; ; width:880px;z-index:999;border-radius:25px;" class="single-cat">
<h1 align="center" style="width:830px; margin-top:-40px;"><?php echo $res['nome_cat']; ?></h1>
<div style="margin-left:357px;width:50px;" class="cat-links">
<a class="close-btn" href="javascript:;" title="Voltar">
<img src="img/fechar.jpg" />
</a>
</div>
<?php
$codigo = $_POST['codigo'];
$img_prod = $_POST['img_prod'];
$titulo = $_POST['titulo'];
$descricao = $_POST['descricao'];
$nome_cat = $_POST['nome_cat'];
$query_produtos = mysql_query("SELECT * FROM produtos WHERE nome_cat = '$nome_cat'") or die(mysql_error());
while($res = mysql_fetch_array($query_produtos)){
?>
<div style="float:left; width:112px; height:133px; padding:2px 10px;" id="songs-list">
<a class="song-link" href="javascript:;" title="">
<img style="position:relative; top:50%; transform:translateY(-50%);" src="img_prod/<?php echo $res['img_prod']; ?>" width="100" title="<?php echo $res['titulo']; ?>" />
</a>
<div style=" margin-top:120px;z-index:999;border-bottom-right-radius:25px;border-top-right-radius:25px;" class="single-song">
<div style="width:50px;margin-left:300px;" class="song-links">
<a class="close-btn" href="javascript:;" title="Voltar">
<img src="img/fechar.jpg" />
</a>
<div class="song-sides">
<img style="margin:40px 0 0 -142px;" src="img_prod/<?php echo $res['img_prod']; ?>" width="369" />
</div>
</div>
<h1> <?php echo $res['titulo']; ?> </h1>
<div class="entry" style="overflow-y: hidden; padding: 0px; width: 100px;">
<p style="font-family:Verdana, Geneva, sans-serif; size:14px; font-weight:bold; color:#ccc;">
<?php echo nl2br($res['descricao']); ?>
</p>
<div class="jspContainer" style="width: 100px; height: auto;">
<div class="jspPane" style="padding: 0px; top: 0px; width: 100px;">
</div></div>
</div>
<span class="song-sides left-side"></span>
</div>
</div>
<?php } ?>
</div>
</div>
<?php
}
?>
</div>
</div>
porem quando insiro o WHERE nome_cat = '$nome_cat'
ele não me traz nada, mas quando o retiro, ele me traz todos os produtos listados na tabela PRODUTOS, independente da categoria selecionada.
Fiz algumas pesquisas e acho que estou precisando criar um manipulador de eventos, mas sou muito leigo em JavaScript.
Se os amigos puderem me dar essa ajuda, ficarei agradecido.
name
evalue
para que esteja disponível no back-end.