Menú y submenús con PHP y MySQL

[-Defero-]

No sé exactamente dónde debería ir esta duda, en PHP o en MySQL. Si algún moderador considera que el tema debe cambiar de subforo, lo comprenderé. Dicho esto, paso a explicar mi duda.

Quiero crear un documento que sea un compendio de enlaces extraídos de una base de datos MySQL, para poder gestionarlos desde el navegador mediante PHP. Quiero que se muestren de la siguiente manera:

Categoría A
enlace a
enlace b
enlace c

Categoría B
enlace d
enlace e
enlace f

Podría meter todos los enlaces en una misma tabla, añadirles un campo adicional para especificar a qué categoría corresponden, y crear una consulta para cada categoría. El problema es que en ese caso debería especificar de antemano cuáles serán las categorías que crearé, y escribir tantas consultas como categorías haya. Si más adelante decido añadir una nueva categoría, tendré que modificar la consulta.

En vez de eso, quiero poder añadir nuevas categorías en la base de datos mediante PHP, sin tener que modificar las consultas para añadir una nueva categoría.

Así que mi base de datos (de momento) constará de dos tablas: una de categorías, y otra de enlaces (más adelante quiero meter categorías y subcategorías, pero de momento no quiero complicarme tanto, vayamos paso a paso).

La tabla "categoria" tendrá dos campos: "ref_categoria" y "nombre".

La tabla "enlaces" tendrá cuatro campos: "ref_enlace", "ref_categoria" (que especificará a qué categoría corresponde cada enlace), "nombre", y "url".

Una vez montada la tabla y añadidos algunos datos de prueba, me pongo manos a la obra. Vamos a lo fácil: listar los distintos enlaces. Para simplificar sólo mostraré el dato "ref_enlace" (me salto la parte de conexión):

Código PHP:

  <?  
$consulta = "SELECT * FROM enlaces ORDER BY ref_enlace ASC"; 
$resultado = mysql_query($consulta); 
while ($rows = mysql_fetch_array($resultado)) 
echo "<li><b>Enlace $rows[ref_enlace]</b></li>"; 
$i++; 
?>   

Esto me muestra una lista de los elementos que he metido en la base de datos, pero sin "categorizar". Mi pregunta es, ¿cómo puedo combinar la consulta a la tabla de enlaces y a la tabla de categorías, para que se muestren los enlaces en sus respectivas categorías?

He estado buscando, y creo que se puede hacer mediante INNER JOIN, pero no estoy seguro. He intentado sustituir la consulta anterior por ésta:

Código PHP:

  $consulta = "SELECT * FROM enlaces INNER JOIN categoria ON enlaces.ref_categoria = categoria.ref_categoria ORDER BY categoria.ref_categoria_ ASC, enlaces.ref_enlace ASC";  
   

Pero el resultado ha sido negativo, me da el siguiente error:

Warning: mysql_fetch_array(): supplied argument is not a valid MySQL result resource in /home/html/prueba.php on line 15

¿Alguien me podría orientar un poco? Estoy bastante perdido.

[luchope]

el error que te aparece es de codigo SQL. una buena prueba es trabajar primero en la consola de Mysql, o phpMyAdmin y probar ahí las sentencias de SQL.


Chaop!

[edwinandlozano]

hum.. lo que tienes es valido, tu primer planteamiento es mas valido aunque depende de como tienes el diseño de la tabla y de como realizarias las funciones para construir el menu.. mira este ejemplo.. puede que te ayude en algo..
http://forum.imasters.com.br/index.php?showtopic=192384

[-Defero-]

Iniciado por edwinandlozano

hum.. lo que tienes es valido, tu primer planteamiento es mas valido aunque depende de como tienes el diseño de la tabla y de como realizarias las funciones para construir el menu.. mira este ejemplo.. puede que te ayude en algo..
http://forum.imasters.com.br/index.php?showtopic=192384

Gracias por la ayuda, pero creo que el ejemplo no me sirve. En el ejemplo que me pones se consulta una sola tabla, y yo necesito consultar dos tablas para extraer las categorías, los enlaces, y luego presentar cada enlace dentro de su categoría.

[edwinandlozano]

Defero.tk podrias colocar la estrucutura de tus dos tablas ...?

[-Defero-]

Creo que lo que me pides ya lo he explicado en el primer mensaje:

Iniciado por Defero.tk

Así que mi base de datos (de momento) constará de dos tablas: una de categorías, y otra de enlaces (...).

La tabla "categoria" tendrá dos campos: "ref_categoria" y "nombre".

La tabla "enlaces" tendrá cuatro campos: "ref_enlace", "ref_categoria" (que especificará a qué categoría corresponde cada enlace), "nombre", y "url".

Por si fuera necesaria más información:

Código:

CREATE TABLE `categoria` (
  `ref_categoria` mediumtext NOT NULL,
  `nombre` mediumtext NOT NULL
) ENGINE=MyISAM DEFAULT CHARSET=latin1;

CREATE TABLE `enlaces` (
  `ref_enlace` mediumtext NOT NULL,
  `ref_categoria` mediumtext NOT NULL,
  `nombre` mediumtext NOT NULL,
  `url` mediumtext NOT NULL
) ENGINE=MyISAM DEFAULT CHARSET=latin1;

No sé si es eso lo que me pides.

[edwinandlozano]

Podría meter todos los enlaces en una misma tabla, añadirles un campo adicional para especificar a qué categoría corresponden

En el ejemplo que te mande tiene para realizar el menu con submenu, todo en la misma tabla, que es lo que inicialmente habias dicho pero que tenias un inconveniente:

El problema es que en ese caso debería especificar de antemano cuáles serán las categorías que crearé, y escribir tantas consultas como categorías haya. Si más adelante decido añadir una nueva categoría, tendré que modificar la consulta.

Pero te fijaste en la pagina que te envie como el autor del ejemplo resolvio el problema?

Mira el resultado de la funcion:
http://tmferreira.pandela.org/menu/index.php

No se si eso es el resultado al que quieres llegar.

[-Defero-]

Voy a volver a echarle un vistazo, porque creo que la primera vez no lo he entendido bien. Entre que no entiendo portugués y que sé muy poco de PHP... ya te contaré qué me sale.

Muchas gracias.

[-Defero-]

¡Tenías razón, ha funcionado! ¡Muchas gracias!

Voy a pulirlo un poco, y pongo la explicación exacta de cómo lo he hecho.

[-Defero-]

Bueno, aquí os traigo lo que he hecho hasta ahora. Aún falta por pulir algunos detalles, mejorar la estética, y lo más importante, falta añadirle un formulario para poder añadir cómodamente nuevas entradas al menú, pero en este momento ya es operativo. El código:

Código PHP:

 <html>
<head>
<script type="text/javascript">
<!--
function desplegar(menu)
{
obj = document.getElementById(menu);
if( obj.style.display != '' ) obj.style.display='';
else obj.style.display='none';
}
-->
</script>
<style type="text/css" media="all">
body 
    {
    background-color: #ddd;
/*    margin-left: 20px;
    margin-top: 40px;
    margin-right: 20px;
    margin-bottom: 10px;
*/
    }
p,font,th,td
    {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    color: #000;
    font-size: 10pt;
    text-align: justify;
    margin-left:1em;
    margin-right:1em;
    }
ul, li
    {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    color: white;
    background-color: black;
    font-size: 9pt;
    list-style: none;
    margin: 0;
    padding: 2px;
    }
ul ul li
    {
    padding-left: 10px;
    border: 1px solid black;
    background-color: #aaa;
    color: #000;
    margin-left: 10px;
    }
ul ul li:hover
    {
    background-color: #888;
    }

ul ul ul li
    {
    padding-left: 10px;
    border: 1px solid black;
    background-color: white;
    color: #000;
    margin-left: 20px;
    }
ul ul ul li:hover
    {
    background-color: #ccc;
    }

ul.trucos
    {
    background-color: transparent;
    }
ul.trucos li
    {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    color: black;
    background-color: white;
    font-size: 11pt;
    list-style: none;
    margin: 10px;
    padding: 5px;
    }
a:link,a:active,a:visited
    {
    color: #688fdd;
    text-decoration: none;
/*    font-weight: bold; */
    }
a:hover
    {
    color: #357bf4;
    text-decoration: underline;
    }
</style>
</head>
<body>

<?
    function geraMenuAuto($id = 0)
    {
        $sql = "SELECT * FROM menu WHERE id_menu_pai = '" . $id . "' ORDER BY id_menu";
        $conexao = mysql_connect("servidor", "usuario", "clave"); //MODIFIQUE ESTA LINHA COM OS DADOS DO SEU SERVIDOR
        $bd = mysql_select_db("menu", $conexao); //MODIFIQUE ESTA LINHA COM O NOME DO SEU BANCO DE DADOS
        $query = mysql_query($sql);
        mysql_close($conexao);
        $numLinhas = mysql_num_rows($query);
        for($i = 0; $i < $numLinhas; $i++)
        {
            list($id_menu, $id_menu_pai, $titulo, $link) = mysql_fetch_row($query);

          
            if (existeFilho($id_menu) > 0)
                {
                  $var .= "    <li style=\"cursor: pointer;\" onclick=\"desplegar('$titulo');\">$titulo ";
                $var .= "<span style=\"position: absolute; right: 15px;\"><img src=\"dot.png\"></span></li>\n\n    <ul id=\"$titulo\" style=\"display: none\">\n" . geraMenuAuto($id_menu) . "    </ul>\n\n";
                }
            else
                    $var .= "    <li style=\"cursor: pointer;\" onclick=\"desplegar('$titulo');\"><a href=\"$link\" target=\"_blank\">$titulo</a> ";
            if ($i != $numLinhas -1)
                $var .= "</li>\n";
            else
                $var .= "";
        }
        if (strlen($var) > 0)
            return $var;
        else
            return false;
    }
    function existeFilho($id)
    {
        $sql = "SELECT * FROM menu WHERE id_menu_pai = '" . $id . "' ORDER BY id_menu_pai";
        $conexao = mysql_connect("localhost", "foroepj", "clave"); //MODIFIQUE ESTA LINHA COM OS DADOS DO SEU SERVIDOR
        $bd = mysql_select_db("menu", $conexao); //MODIFIQUE ESTA LINHA COM O NOME DO SEU BANCO DE DADOS
        $query = mysql_query($sql);
        mysql_close($conexao);
        return mysql_num_rows($query);
    }
?>

<ul style="width: 300px; position: absolute; left: 10px;">
<?

echo geraMenuAuto();

?>
</ul>
</body>
</html>  

De momento podéis probar metiendo esto en la base de datos:

Código:

CREATE TABLE `menu` (
  `id_menu` int(11) NOT NULL auto_increment,
  `id_menu_pai` int(11) NOT NULL default '0',
  `titulo` varchar(100) NOT NULL,
  `link` varchar(200) NOT NULL,
  PRIMARY KEY  (`id_menu`)
) ENGINE=MyISAM AUTO_INCREMENT=19 DEFAULT CHARSET=latin1 AUTO_INCREMENT=19 ;

-- 
-- Volcar la base de datos para la tabla `menu`
-- 

INSERT INTO `menu` VALUES (4, 1, 'foro Photoshop', 'http://cursophotoshop.foro.st');
INSERT INTO `menu` VALUES (3, 1, 'Forosdelweb (GNU/Linux)', 'http://www.forosdelweb.com/forumdisplay.php?forumid=41');
INSERT INTO `menu` VALUES (2, 1, 'Barrapunto', 'http://www.barrapunto.com');
INSERT INTO `menu` VALUES (1, 0, 'Comunidades y visitas diarias', '');
INSERT INTO `menu` VALUES (5, 1, 'apocalipsis', 'http://mundocadaver.livejournal.com/');
INSERT INTO `menu` VALUES (6, 0, 'Buscadores y fuentes de información', '');
INSERT INTO `menu` VALUES (7, 6, 'Google', '');
INSERT INTO `menu` VALUES (8, 7, 'Google-es', 'http://www.google.es');
INSERT INTO `menu` VALUES (9, 7, 'GoogleMaps', 'http://maps.google.es');
INSERT INTO `menu` VALUES (10, 7, 'GoogleImages', 'http://images.google.es');
INSERT INTO `menu` VALUES (11, 7, 'GoogleNews', 'http://news.google.es');
INSERT INTO `menu` VALUES (12, 6, 'Wikipedia', '');
INSERT INTO `menu` VALUES (13, 12, 'Wikipedia-es', 'http://es.wikipedia.org');
INSERT INTO `menu` VALUES (14, 12, 'Wikipedia-eu', 'http://eu.wikipedia.org');
INSERT INTO `menu` VALUES (15, 6, 'RAE', '');
INSERT INTO `menu` VALUES (16, 15, 'RAE', 'http://www.rae.es');
INSERT INTO `menu` VALUES (17, 15, 'RAE2', 'http://www.rae2.es');
INSERT INTO `menu` VALUES (18, 6, 'Tirantonline', 'http://www.tirantonline.com');

Añadidle un icono "dot.png" para que el usuario sepa qué elementos del menú son desplegables.