Jump to content
Fórum Script Brasil
  • 0

[RESOLVIDO] Cadastrando Categoria


securao
 Share

Question

Olá, Galera estou fazendo um trabalho para cadastrar matérias de escola por exemplo: Eu Cadastro uma matéria "PORTUGUÊS" e depois eu tenho tipo uma sub matéria "ADVERBIOS" que tenho que cadastrar dentro de "PORTUGUÊS".

 

                                                          Nome:|__________________| (Botão Adicionar)

Combo box: |__Selecione uma Matéria_|\/|_|    Nome:|__________________| (Botão Adicionar)             

 

e depois eu mostros os dados em uma tabela abaixo onde eu posso editar o nome da matéria ou deletar e fazer o mesmo com a sub matéria alguém poderia me ajudar por favor uma luz de como eu vou começar.

 

MATÉRIA: |___PORTUGUÊS___| (editar) (excluir)

Sub MATÉRIA:|___ADVERBIOS___|(editar) (excluir)

Sub MATÉRIA:|___VERBOS___|(editar) (excluir)

Sub MATÉRIA:|___ARTIGOS___|(editar) (excluir)

 

Muito Obrigado pela atenção. :D

Edited by securao
resolvido o problema
Link to comment
Share on other sites

11 answers to this question

Recommended Posts

  • 0

Bom dia  , 

Voce já tem as tabelas criadas ? Caso sim  , poste a estrutura delas aqui . 

Caso não  , aconselho fazer 1 tabela para as Materias principais e 1 para as sub matérias  :

tbl_materias_principais : 

id    nome             data_criacao    data_update                    ativa

1     Matematica    2015-09-16     0000-00-00   00:00:00        1

2    Portugues      2015-09-16     0000-00-00     00:00:00       1

tbl_materias_secundarias

id   id_materias(aqui vai o id da materia principal)  nome    data_criacao    data_update    ativa

1       1                Matrizes      2015-09-16     0000-00-00   00:00:00        1

1       1                Logaritmo  2015-09-16     0000-00-00   00:00:00        1

etc etc etc

 

Depois que cadastrar as matérias , você faria uma pagina fazendo um select na tabela das materias principais

Select * from tbl_materias_principais where ativo = 1

Listaria as Matérias que voce tem cadastrado no banco .

Matematica    Ver   Editar  Excluir

Portugues      Ver   Editar  Excluir

 

Ao clicar em 'VER' , abriria uma outra pagina , que faria um select no banco na tabela de materias secundarias , passando o ID da materia principal como parametro.

Assim , voce faria a consulta : Select * from tbl_materias_secundarias where id_metaria = $id and ativo = 1

Acho que assim , já da para voce ter um norte de como fazer.

 

Qualquer coisa  , comenta ai 

Edited by h_felix
Link to comment
Share on other sites

  • 0

consegui fazer para mostrar os dados e também separar em duas colunas agora como eu posso fazer para usar div para dar uns efeitos em css. e como fazer para listar as submatérias abaixo da sua respectiva matéria deixo o código ai para quem estiver com a mesma duvida obrigado pelo ajuda cara.

<table align="center">
  <tr>
     <td><b>Matérias</b></td>
  </tr>
<?php
include 'conexao.php';
$sql = "SELECT * FROM materias";
$i=1;
$exe = mysql_query($sql);
while($linha = mysql_fetch_array($exe)){
echo "	<td><a href=''>".$linha['materias_n']."</a></td>	";
	  if( $i%2 == 0 ) {
			 echo "</tr><tr>";
		 }
		 $i++;
}
?>

</table>

As tabelas estão assim

Tabela Matérias

Id     |     Matérias

1      |     Portugues

2      |     Matematica

Tabela Sub Matérias

id     |     Id_Materia     |     Sub Matéria

1      |            1            |     Adverbios

1      |            1            |     Artigos

1      |            2            |     Soma

1      |            2            |     Subtração

 

 

 

 

 

Edited by securao
Adicionar mais informações a minha duvida
Link to comment
Share on other sites

  • 0

Bom dia  , 

Ótimo ! 

 

Eu não aconselho o uso de tabelas nessa caso para listar o conteúdo. 

Eu colocaria as matérias principais em div'`s , e quando o usuario clicar  , abriria outra pagina para a submatéria correspondente.

Ex: 

Css. 

            .box{
                border: 1px solid red;
                width: 33%;
                float: left;
                box-sizing: border-box;
                margin-bottom: 15px;
            }
            .titulo{
                background: gray;
                color: #fff;
                text-align: center;
            }
            .texto{
                padding: 10px;
                
            }
            @media screen and (max-width: 850px) {
                .box {
                    width: 50%;
                }
            }
 
            @media screen and (max-width: 480px) {
                .box {
                    width: 100%;
                }
            }
<?php
include 'conexao.php';
$query_sql = mysql_query ("SELECT * FROM materias");
while($linha = mysql_fetch_array(query)){

 echo   '<div class="box">
            <div class="titulo">'.$linha['materias_n'].'</div>
            <div class="texto">
                Aqui , caso nao tenha  , adcione um campo de descriçao para a metéria , caso deseje.
                '.$linha['materias_desc'].'
                
                <a href="minha_pagina_de_submateria.php?id_materia='.$linha['id'].'">Ver materias</a>
            </div>
        </div>';
}

?>
       

E na pagina '

minha_pagina_de_submateria.php' voce pega via get o ID da materia : 

 

<?php
include 'conexao.php';

$id_materia = $_GET['id_materia'];

$query_sql = mysql_query ("SELECT * FROM submateria where id_materia = $id_materia");
while($linha = mysql_fetch_array(query)){

 echo   '<div class="box">
            <div class="titulo">'.$linha['sub_materias_n'].'</div>
            <div class="texto">
                Aqui , caso nao tenha  , adcione um campo de descriçao para a metéria , caso deseje.
                '.$linha['sub_materias_desc'].'
                
                <a href="minha_pagina_de_submateria_2.php?id_submateria='.$linha['id'].'">Ver materias</a>
            </div>
        </div>';
}

?>

E assim por diante , voce pode ir definindo o id principal no <a href> e criando paginas pra pegar o id e exibir o que voce quer.

 

Segue exemplo de como é para ficar : 

http://jsfiddle.net/h_felix/vog5eqmo/

Ps: As divs estao responsivas, se adaptando as resoluçoes menores sem quebrar o conteudo .

Testa ai e posta se deu certo

Link to comment
Share on other sites

  • 0

SHOW DE BOLA você está me ajudando muito vlw :D mas tipo como eu estou tentando fazer é tipo a foto que eu anexei estou tentando para aparecer logo abaixo as sub_matérias. muito obrigado pela atenção ai cara.

http://www.jqueryscript.net/menu/Super-Smooth-Accordion-Dropdown-Menu-with-jQuery-CSS3.html

 

Super-Smooth-Accordion-Dropdown-Menu-with-jQuery-CSS3.jpg

 

Boa noite , 

 

Sem problemas , estamos aqui para ajudar . 

 

Não testei em um banco de dados , mas ve se isso resolve seu problema. 

 

pagina_lista_materias.php

<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1.0" />
<title>Minha Pagina de materias</title>
<link href="http://netdna.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet" type="text/css">

</head>

<body>
<div class="jquery-script-ads" align="center" style="margin:20px auto"><script type="text/javascript"><!--
google_ad_client = "ca-pub-2783044520727903";
/* jQuery_demo */
google_ad_slot = "2780937993";
google_ad_width = 728;
google_ad_height = 90;
//-->
</script>

<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>

</div>

<!-- Contenedor -->
	<ul id="accordion" class="accordion">

<?php
	include 'conexao.php';
	$query_sql = mysql_query ("SELECT * FROM materias");
	while($linha = mysql_fetch_array($query_sql)){
	
	$id = $linha['id_materia'];

	echo ' <li>
				<div class="link"><i class="fa fa-database"></i>'.$linha['titulo_materia'].'<i class="fa fa-chevron-down"></i></div>
					<ul class="submenu">'; 
					$query_sql_2 = mysql_query ("SELECT * FROM sub_materia where id_materia = '$id' ");
					while($linha_2 = mysql_fetch_array($query_sql_2)){
					echo '<li><a href="#">'.$linha_2['nome_sub'].'</a></li>';
					}
				echo '</ul>
			</li>';
		}

?>
	</ul>
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script> 
<script>
$(function() {
	var Accordion = function(el, multiple) {
		this.el = el || {};
		this.multiple = multiple || false;

		// Variables privadas
		var links = this.el.find('.link');
		// Evento
		links.on('click', {el: this.el, multiple: this.multiple}, this.dropdown)
	}

	Accordion.prototype.dropdown = function(e) {
		var $el = e.data.el;
			$this = $(this),
			$next = $this.next();

		$next.slideToggle();
		$this.parent().toggleClass('open');

		if (!e.data.multiple) {
			$el.find('.submenu').not($next).slideUp().parent().removeClass('open');
		};
	}	

	var accordion = new Accordion($('#accordion'), false);
});
</script>

<script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-36251023-1']);
  _gaq.push(['_setDomainName', 'jqueryscript.net']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

</script>
</body>
</html>

CSS : 

* {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

/*
body {
  background: #2d2c41;
  font-family: 'Open Sans', Arial, Helvetica, Sans-serif, Verdana, Tahoma;
}
*/

ul { list-style-type: none; }

/*
a {
  color: #b63b4d;
  text-decoration: none;
}

/** =======================
 * Contenedor Principal
 ===========================*/


h1 {
  color: #FFF;
  font-size: 24px;
  font-weight: 400;
  text-align: center;
  margin-top: 80px;
}

h1 a {
  color: #c12c42;
  font-size: 16px;
}

*/

.accordion {
  width: 100%;
  max-width: 360px;
  margin: 30px auto 20px;
  background: #FFF;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

.accordion .link {
  cursor: pointer;
  display: block;
  padding: 15px 15px 15px 42px;
  color: #4D4D4D;
  font-size: 14px;
  font-weight: 700;
  border-bottom: 1px solid #CCC;
  position: relative;
  -webkit-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
}

.accordion li:last-child .link { border-bottom: 0; }

.accordion li i {
  position: absolute;
  top: 16px;
  left: 12px;
  font-size: 18px;
  color: #595959;
  -webkit-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
}

.accordion li i.fa-chevron-down {
  right: 12px;
  left: auto;
  font-size: 16px;
}

.accordion li.open .link { color: #b63b4d; }

.accordion li.open i { color: #b63b4d; }

.accordion li.open i.fa-chevron-down {
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}

/**
 * Submenu
 -----------------------------*/


.submenu {
  display: none;
  background: #444359;
  font-size: 14px;
}

.submenu li { border-bottom: 1px solid #4b4a5e; }

.submenu a {
  display: block;
  text-decoration: none;
  color: #d9d9d9;
  padding: 12px;
  padding-left: 42px;
  -webkit-transition: all 0.25s ease;
  -o-transition: all 0.25s ease;
  transition: all 0.25s ease;
}

.submenu a:hover {
  background: #b63b4d;
  color: #FFF;
}

 

Altere o nome dos bancos e das variaveis de acordo com o seus dados.

Posta aqui se deu certo  . 

Ps.: Comentei um pedaço do CSS , pois tem classes ( h1 , a ) que caso voce chame o script na index , iria afetar seu conteudo definido nessas classes.

Edited by h_felix
Link to comment
Share on other sites

  • 0

ficou show de bola muito obrigado pela ajuda só mais uma pergunta para mostrar as matérias em uma combobox e  eu clicar na matéria especifica e ao lado estiver um edit para eu colocar o nome da sub matéria e cadastra-la é praticamente o mesmo processo né?

Boa tarde  , 

Depende. Pelo efeito que você escolheu para mostrar as matérias e submatérias nessa pagina , eu particularmente não colocaria um botão para editar nela , pois é uma pagina para exibição de seu conteúdo e não para edição de dados

Eu faria uma outra pagina , dessa vez mostrando os dados em uma tabela . Listaria todas as matérias cadastrada no banco e colocaria 3 botões : 

1 -> ver dados

2 -> Editar ( trocar o nome no caso )

3 -> Excluir.

 

ID     Nome              Ação.

1      Matemática    Ver dados  Editar  Excluir

 

Ao clicar em editar , passaria o ID da matéria na URL , e abriria uma outra pagina , exibindo as submatérias pertencentes a mesma e um botão para cadastrar uma nova submatéria para ela. 

Caso voce tenha sub materia de submateria ( que estranho falando assim hehe ) Ex: 

Materia : Matematica

Sub_1 : Matrizes ( Submatéria de Matematica )

Sub_2 : Determinantes ( Submatéria de Matrizes )

 

Você faria a mesma coisa , listaria as submatérias , (id , nome  , ação ) 

1 -> ver dados

2 -> Editar ( trocar o nome , conteúdo ,descrição , etc )

3 -> Excluir.

 E assim por diante. 

 

Caso você opte em fazer nessa pagina que ajudei ( com o efeito de menu dropdown  )  , seguiria a mesma lógica . 

 

Qualquer coisa posta ai . 

 

Se ajudei , marque como resolvido . Vlw 

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

  • Forum Statistics

    • Total Topics
      149.6k
    • Total Posts
      646.2k
×
×
  • Create New...