menu com categoria [RESOLVIDO] Criando menu com categoria e sub categoria

Jack Oliveira · Fevereiro 10, 2020

Ola boa noite

@Motta

@Omar~

@Felipe Guedes Coutinho

Poderia me dar uma ajuda...

estou montando um menu conforme cadastrar no banco eles aparecem no site ex:

Femenina

Blusas

Saias

MASCULINA

Blusas

Bermudas

Fiz desta forma aqui... mais não aparece as que foi cadastrada

Na tabela esta assim


CREATE TABLE `c_catalogo_categoria` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `categoria` varchar(255) NOT NULL,
  `autor` varchar(50) NOT NULL,
  `data` date NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB  DEFAULT CHARSET=latin1 AUTO_INCREMENT=0 ;


CREATE TABLE `c_catalogo` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `categoria` varchar(255) NOT NULL,
  `autor` varchar(50) NOT NULL,
  `data` date NOT NULL,
 `id_categoria` int(11) NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB  DEFAULT CHARSET=latin1 AUTO_INCREMENT=0 ;

<?php 
/* Este aqui é o que vai ter o nome ao menu ex: HOME | EMPRESA | ACESSÓRIOS | FEMENINA | MASCULINA | CONTATO
ESTAS SERÁ AS CATEGORIAS QUE FIZ ELA COMO A SUB: | ACESSÓRIOS | FEMENINA | MASCULINA |
*/
	$QueryCatSub = DBRead('c_catalogo_categoria','*',"ORDER BY categoria ASC"); if (is_array($QueryCatSub)) { foreach ($QueryCatSub as $c_categoria) {
		$categoria           = $c_categoria['categoria'];
        $id           = $c_categoria['id'];
       $slug           = $c_categoria['slug'];


?>							
								<li class="dropdown"> 
									<a href="#" class="dropdown-toggle"><?php echo $c_categoria['categoria']; ?></a>
									<span class="menu-toggler collapsed" data-toggle="collapse" data-target=".collapse-2">
										<i class="fa fa-angle-down"></i>
									</span>
									
									<!-- DropDown Menu Begins -->
									<ul role="menu" class="dropdown-menu collapse-2 collapse">	
<?php 
/* ESTA SERÁ TODOS OS ITEM CRIADO PARA APARECER EM CADA CATEGORIA QUE EU INFORMEI AI EM CIMA
ex: 

*/

	$QueryCat = DBRead('c_catalogo','*'," WHERE id_categoria ='{$id}' ORDER BY categoria ASC"); if (is_array($QueryCat)) { foreach ($QueryCat as $c_catalogo) {
		$categoria           = $c_catalogo['categoria'];
        $id           = $c_catalogo['id'];
       $slug           = $c_catalogo['slug'];
?>									
<li><a href="<?php echo ConfigPainel('site_url'); ?>produtos?mv=<?php echo $c_catalogo['slug']; ?>-<?php echo $c_categoria['slug']; ?>"><?php echo $c_catalogo['categoria']; ?></a></li>
<?php } } ?>


									</ul>
									<!-- DropDown Menu Ends -->
								</li>
<?php } } ?>

ESPERO QUE CONSEGUEM ENTENDER AI

DESTE JÁ FICO AGRADECIDO

Omar~ · Fevereiro 11, 2020

Tenta isso dentro do laço de repetição:

if ($c_categoria['categoria'] == 'FEMININO') { ?>
  <li><a href="<?= ConfigPainel('site_url'); ?>produtos?mv=<?= $c_catalogo['slug']; ?>-<?= $c_categoria['slug']; ?>"><?= $c_catalogo['categoria'];?></a></li>
<?php } else { ?>
  <li><a href="<?= ConfigPainel('site_url'); ?>produtos?mv=<?= $c_catalogo['slug']; ?>-<?= $c_categoria['slug']; ?>"><?= $c_catalogo['categoria']; ?></a></li>
<?php }

No caso o FEMININO "em caixa alta" significa o valor da coluna para feminino, no entanto acho que usar GROUP BY será necessário.

Ou então fazer duas consultas, uma só para listar as categorias outra para listar os produtos, isso foi até pauta minha aqui no fórum:

https://forum.imasters.com.br/topic/580417-separar-resultados-com-base-de-outra-tabela/

Jack Oliveira · Fevereiro 11, 2020

13 horas atrás, Omar~ disse:
Tenta isso dentro do laço de repetição:
if ($c_categoria['categoria'] == 'FEMININO') { ?>
  <li><a href="<?= ConfigPainel('site_url'); ?>produtos?mv=<?= $c_catalogo['slug']; ?>-<?= $c_categoria['slug']; ?>"><?= $c_catalogo['categoria'];?></a></li>
<?php } else { ?>
  <li><a href="<?= ConfigPainel('site_url'); ?>produtos?mv=<?= $c_catalogo['slug']; ?>-<?= $c_categoria['slug']; ?>"><?= $c_catalogo['categoria']; ?></a></li>
<?php }
No caso o FEMININO "em caixa alta" significa o valor da coluna para feminino, no entanto acho que usar GROUP BY será necessário.

Ou então fazer duas consultas, uma só para listar as categorias outra para listar os produtos, isso foi até pauta minha aqui no fórum:

https://forum.imasters.com.br/topic/580417-separar-resultados-com-base-de-outra-tabela/

Boa tarde @Omar~ deu certo obrigado valeu ai pelas dicas tbm

Se eu puder usar este mesmo topic se não peso desculpas

Tenho dois select um de CATEGORIAS outro de SUB CATEGORIAS

o que eu quero fazer é o seguinte

quando for selecionado uma categoria tudo que estiver dentro desta categoria aparecer

EX:

FEMENINO

MASCULINO

ACESSORIOS

ETC....

No que eu estou dizendo seria tudo que for cadastrado em FEMENINO APARECER APENAS DO FEMENINO

SE SELECIONAR MASCULINO APARECER APENAS DO MASCULINO E ASSIM VAI

											<div class="col-md-6">
											<div class="form-group">
									            <label>Categoria:</label>
									            <select class="form-control select2" name="id_categoria" required>
												<option value="">Selecione uma Categoria</option>
									            	<?php $Query = DBRead('c_catalogo','*','order by categoria ASC'); if (is_array($Query)) { foreach ($Query as $c_dados) { ?>
									            	<option value="<?php echo $c_dados['id']; ?>"><?php echo $c_dados['categoria']; ?></option>
									            	<?php } } ?>
									            </select>
											</div>
											</div>	
											<div class="col-md-6">
											<div class="form-group">
									            <label>Sub Categoria:</label>
									            <select class="form-control select2" name="id_sub_categoria" required>
												<option value="">Selecione uma Categoria</option>
									            	<?php $Query = DBRead('c_catalogo_sub','*','order by categoria ASC'); if (is_array($Query)) { foreach ($Query as $c_dados) { ?>
									            	<option value="<?php echo $c_dados['id']; ?>"><?php echo $c_dados['categoria']; ?></option>
									            	<?php } } ?>
									            </select>
											</div>
											</div>											
								<div class="col-md-6">
										<div class="form-group">
											<label>Titulo:</label>
								    		<input class="form-control basic-usage" name="titulo"  placeholder="EX: Nome do Produto" required>
										</div>
									</div>
								<div class="col-md-6">
										<div class="form-group">
											<label>Slug:</label> <em>Url SEO do site</em>
											<input class="form-control" name="slug" id="permalink">
								    	
										</div>
									</div>

Na tabela esta mais o menos isso aqui

CREATE TABLE `catalogo` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `titulo` varchar(255) NOT NULL,
  `slug` varchar(255) NOT NULL,
  `data` date NOT NULL,
 `id_categoria` int(11) NOT NULL,
`id_sub_categoria` int(11) NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB  DEFAULT CHARSET=latin1 AUTO_INCREMENT=0 ;

Desde já fico grato...

Omar~ · Fevereiro 12, 2020

Adicione um evento change ao seletor, ao modificar-lo faça um ajax para um arquivo que irá ler os dados no db de acordo com a informação recebida.

Spoiler


<select id="seletor">
    <option value="a">Selecionar tudo que for A</option>
    <option value="b">Selecionar tudo que for B</option>
    <option value="c">Selecionar tudo que for C</option>
</select>

<div id="mostrar"></div>

<script>
    var alvo = document.getElementById('seletor'),
    opcao = alvo.value;
    alvo.addEventListener('change', funcao, false);

    function funcao(e) {
        var valorAtual = e.target.value,
        xhttp;

        if (valorAtual !== window.opcao) { // Só funcionar se o valor foi realmente modificado
            window.opcao = valorAtual;

            xhttp = new XMLHttpRequest();
            xhttp.onreadystatechange = function () {
                if (xhttp.readyState == 4 && xhttp.status == 200) {
                    document.getElementById('mostrar').innerHTML = xhttp.responseText;
                }
            };
            xhttp.open('GET', 'arquivo.php?informacao=' + valorAtual, true);
            xhttp.send();
        }
    }
</script>

Com isso ao modificar o seletor iniciamos uma requisição AJAX via GET para um arquivo php informando o value do seletor como parâmetro, ao qual será carregado dentro do elemento #mostrar, nesse arquivo então poderemos fazer a leitura do banco de dados de acordo com essa informação.

Esse mesmo arquivo pode já ser carregado dentro dessa div através de um include e fazer a leitura uma vez que ainda não recebeu nenhuma informação.

Caso queira uma forma bem simples de enviar requisições ajax segue o link dessa aplicação que desenvolvi:

https://github.com/Spell-Master/sm-web/tree/master/javascript/AjaxRequest

Jack Oliveira · Fevereiro 13, 2020

Bom dia @Omar~

Eu estava vendo os seus exemplos e fiz ele da seguinte forma

não sei se seria o método correto de fazer, mais deu certo

Bom criei o Java script assim

function getSubcat(val) {
	$.ajax({
	type: "POST",
	url: "get_subcat.php",
	data:'id_categoria='+val,
	success: function(data){
		$("#id_sub_categoria").html(data);
	}
	});
}

function selectCountry(val) {
$("#search-box").val(val);
$("#suggesstion-box").hide();
}

E criei um arquivo chamado get_subcat.php onde estaria os resultado que preciso

<?php 
	header('Access-Control-Allow-Origin: *');
	require_once('includes/funcoes.php');
	require_once('database/config.database.php');
	require_once('database/config.php');

?>

	<option value="">Selecione uma Categoria</option>
	<?php 
	if(!empty($_POST["id_categoria"])) 
{
 $id=intval($_POST['id_categoria']);

       $QuerySubCat = DBRead('c_catalogo_sub','*',"WHERE id_categoria=$id ORDER BY id ASC"); if (is_array($QuerySubCat)) { foreach ($QuerySubCat as $c_catalogo_sub) { 

        $categoria   = $c_catalogo_sub['categoria'];
        $id          = $c_catalogo_sub['id'];
		// echo 'Categoria de Teste: '.$c_catalogo_sub['categoria'].'';
?>
	<option value="<?php echo $c_catalogo_sub['id']; ?>"><?php echo $c_catalogo_sub['categoria']; ?></option>
		<?php } } } ?>

Dentro do meu catálogo.php

onde estão os select fiz assim

											<div class="col-md-6">
											<div class="form-group">
									            <label>Categoria:</label>
									            <select class="form-control select2" onChange="getSubcat(this.value);" name="id_categoria" required>
												<option value="">Selecione uma Categoria</option>
									            	<?php $Query = DBRead('c_catalogo','*','order by categoria ASC'); if (is_array($Query)) { foreach ($Query as $c_dados) { ?>
									            	<option value="<?php echo $c_dados['id']; ?>"><?php echo $c_dados['categoria']; ?></option>
									            	<?php } } ?>
									            </select>
											</div>
											</div>	
								<div class="col-md-6">
											<div class="form-group">
									            <label>Sub Categoria:</label>
									            <select class="form-control" name="id_sub_categoria"  id="id_sub_categoria" required>

									            </select>
											</div>
											</div>

Dentro desta mesmo catalogo.php na parte de edição fiz assim

		                           <div class="col-md-6">
											<div class="form-group">
									            <label>Categoria:</label>
									            <select class="form-control select2"  onChange="getSubcat(this.value);" name="id_categoria" required>
												<option value="">Selecione uma Categoria</option>
									            	<?php $Query = DBRead('c_catalogo','*','order by categoria ASC'); if (is_array($Query)) { foreach ($Query as $c_dados) { ?>
	<option value="<?php echo $c_dados['id']; ?>" <?php Selected($dados['id_categoria'], $c_dados['id']); ?>><?php echo $c_dados['categoria']; ?></option>
									            	<?php } } ?>
									            </select>
											</div>
											</div>	
		<div class="col-md-6">
											<div class="form-group">
									            <label>Sub Categoria:</label>
									            <select class="form-control select2" name="id_sub_categoria"  id="id_sub_categoria" required>
												<?php $Query = DBRead('c_catalogo_sub','*','order by categoria ASC'); if (is_array($Query)) { foreach ($Query as $c_dados) {  ?>
<option value="<?php echo $c_dados['id']; ?>" <?php Selected($dados['id_sub_categoria'], $c_dados['id']); ?>><?php echo $c_dados['categoria']; ?></option>
									            <?php }} ?>
												</select>
											</div>
											</div>

Assim conseguir chegar ao resultado que precisava seguindo os exemplos do Omar~

Espero que isso possa ajudar alguém também

Entrar

menu com categoria [RESOLVIDO] Criando menu com categoria e sub categoria

Pergunta

Jack Oliveira 1

Compartilhar este post

Link para o post

Compartilhar em outros sites

4 respostas a esta questão

Recommended Posts

Omar~ 87

Compartilhar este post

Link para o post

Compartilhar em outros sites

Jack Oliveira 1

Compartilhar este post

Link para o post

Compartilhar em outros sites

Omar~ 87

Compartilhar este post

Link para o post

Compartilhar em outros sites

Jack Oliveira 1

Compartilhar este post

Link para o post

Compartilhar em outros sites

Crie uma conta ou entre para comentar

Criar uma conta

Entrar

Abrir url na mesma janela

Saber se todos os produtos de uma consulta estão cadastrados no banco de dados

Sistema de Login

Este projeto é apoiado pelas empresas

Fóruns

Tempo Real

Informação importante