Exibir produtos da categoria especificada
Pessoal preciso de uma ajuda sobre mostrar somente os produtos que foi clicado no menu de categorias na mesma página inicial:
<?php
include("admin/conexao.php");
$cat = isset($_GET['id_cat']);
$query = "SELECT * FROM categoria";
$query1 = "SELECT * FROM produto";
$query_emp = "SELECT * FROM empresa WHERE id_emp = 1";
//$query1 = "SELECT * FROM produto WHERE categoria_id = $cat";
$dados = mysqli_query($con,$query);
$dados1 = mysqli_query($con,$query1);
$dados_emp = mysqli_query($con,$query_emp);
$linha_emp = mysqli_fetch_assoc($dados_emp);
?><!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Catálogo Online - </title>
<!-- Bootstrap core CSS -->
<link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="css/shop-homepage.css" rel="stylesheet">
<style>
.window-sobre{
display:none;
width:300px;
height:300px;
position:absolute;
left:0;
top:0;
background:#FFF;
z-index:9900;
padding:10px;
border-radius:10px;
}
#mascara-sobre{
display:none;
position:absolute;
left:0;
top:0;
z-index:9000;
background-color:#000;
}
.fechar-sobre{display:block; text-align:right;}
.window-localizacao{
display:none;
width:640px;
height:480px;
position:absolute;
left:0;
top:0;
background:#FFF;
z-index:9900;
padding:10px;
border-radius:10px;
}
#mascara-localizacao{
display:none;
position:absolute;
left:0;
top:0;
z-index:9000;
background-color:#000;
}
.fechar-localizacao{display:block; text-align:right;}
#produtos{
margin-top: 20px;
}
</style>
</head>
<body><!-- Modal Jquery Sobre -->
<div class="window-sobre" id="janela-sobre">
<a href="#" class="fechar-sobre">X Fechar</a>
<h4>Sobre a empresa</h4>
<p class="text-justify"><?=$linha_emp['sobre_emp']?></p>
</div>
<!-- mascara para cobrir o site -->
<div id="mascara-sobre"></div>
<!-- Fim da Modal Jquery Sobre-->
<!-- Modal Jquery Localização -->
<div class="window-localizacao" id="janela-localizacao">
<a href="#" class="fechar-localizacao">X Fechar</a>
<h4>Localização</h4>
<p class="text-justify"><?=$linha_emp['endereco_emp']?></p>
<p class="text-justify"><?=$linha_emp['fone_emp']?></p>
</div>
<!-- mascara para cobrir o site -->
<div id="mascara-localizacao"></div>
<!-- Fim da Modal Jquery Sobre-->
<!-- Navigation -->
<nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top">
<div class="container">
<a class="navbar-brand" href="#">Catálogo Online</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item active">
<a class="nav-link" href="#">Página inicial
<span class="sr-only">(current)</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#janela-sobre" rel="modal-sobre">Sobre</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#janela-localizacao" rel="modal-localizacao">Localização</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Contato</a>
</li>
</ul>
</div>
</div>
</nav>
<!-- Page Content -->
<div class="container" id="conteudo">
<div class="row">
<div class="col-lg-3">
<h1 class="my-4">Logomarca</h1>
<div class="list-group">
<?php
while ($linha = mysqli_fetch_assoc($dados)) {
?>
<a href="index.php?id_cat=<?=$linha['id_cat']?>" class="list-group-item"><?=$linha['nome_cat']?></a>
<?php
}// fim do while
?>
</div>
</div>
<!-- /.col-lg-3 -->
<div class="col-lg-9">
<div class="row" id="produtos">
<?php
while ($linha1 = mysqli_fetch_assoc($dados1)) {
?>
<div class="col-lg-4 col-md-6 mb-4">
<div class="card h-100">
<img class="card-img-top img-responsive" src="admin/fotos/<?=$linha1['foto_prod']?>" alt="Este produto não possui imagem." width="150px" height="230px"></img>
<div class="card-body">
<h4 class="card-title">
<?=$linha1['titulo_prod']?>
</h4>
<h5>Preço: R$ <?=$linha1['preco_prod']?></h5>
<p class="card-text"><?=$linha1['desc_prod']?></p>
</div>
</div>
</div>
<?php
}// fim do while
?>
</div>
<!-- /.row -->
</div>
<!-- /.col-lg-9 -->
</div>
<!-- /.row -->
</div>
<!-- /.container -->
<!-- Footer -->
<footer class="py-5 bg-dark">
<div class="container">
<div class="container">
<div class="row">
<div class="col-4"></div>
<div class="col-4"> <p class="m-0 text-center text-white">Copyright © Catálogo Online 2019</p></div>
<div class="col-4"><p class="m-0 text-right text-white">Desenvolvimento: System Informática</p></div>
</div>
</div>
</div>
<!-- /.container -->
</footer>
<!-- Bootstrap core JavaScript -->
<script src="vendor/jquery/jquery.min.js"></script>
<script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<!-- Javascript do Modal Sobre Jquery -->
<script>
$(document).ready(function(){
$("a[rel=modal-sobre]").click( function(ev){
ev.preventDefault();
var id = $(this).attr("href");
var alturaTela = $(document).height();
var larguraTela = $(window).width();
//colocando o fundo preto
$('#mascara-sobre').css({'width':larguraTela,'height':alturaTela});
$('#mascara-sobre').fadeIn(1000);
$('#mascara-sobre').fadeTo("slow",0.8);
var left = ($(window).width() /2) - ( $(id).width() / 2 );
var top = ($(window).height() / 2) - ( $(id).height() / 2 );
$(id).css({'top':top,'left':left});
$(id).show();
});
$("#mascara-sobre").click( function(){
$(this).hide();
$(".window-sobre").hide();
});
$('.fechar-sobre').click(function(ev){
ev.preventDefault();
$("#mascara-sobre").hide();
$(".window-sobre").hide();
});
});
</script><!-- Javascript do Modal Localização Jquery -->
<script>
$(document).ready(function(){
$("a[rel=modal-localizacao]").click( function(ev){
ev.preventDefault();
var id = $(this).attr("href");
var alturaTela = $(document).height();
var larguraTela = $(window).width();
//colocando o fundo preto
$('#mascara-localizacao').css({'width':larguraTela,'height':alturaTela});
$('#mascara-localizacao').fadeIn(1000);
$('#mascara-localizacao').fadeTo("slow",0.8);
var left = ($(window).width() /2) - ( $(id).width() / 2 );
var top = ($(window).height() / 2) - ( $(id).height() / 2 );
$(id).css({'top':top,'left':left});
$(id).show();
});
$("#mascara-localizacao").click( function(){
$(this).hide();
$(".window-localizacao").hide();
});
$('.fechar-localizacao').click(function(ev){
ev.preventDefault();
$("#mascara-localizacao").hide();
$(".window-localizacao").hide();
});
});
</script><!-- Fim do Javascript do Modal Localização Jquery -->
</body>
</html>Discussão (1)
Carregando comentários...