menú dinámico con tabla mysql

darlingstella · #1 (**permalink**) 29/03/2009, 22:11

Hola a todos!

Les comento lo que necesito y lo que he hecho, a ver si me pueden ayudar. De antemano, pido disculpas si esta no es la sección adecuada,

pero no supe bien si colocarla en javascript o en mysql, pero me decidí ponerla aquí.

La idea es crear un menú dinámico que muestre las opciones tipo árbol (al estilo explorador de windows) sacadas estas de una tabla menu en mysql, en donde sea posible añadir o eliminar opciones, simplemente añadiendo o eliminando un campo de dicha tabla. Para este comportamiento de abrir y cerrar las opciones, buscando por la red, encontré un js que permite ese comportamiento en una lista html (ul y li) de este tipo:

Código HTML:

<ul id="treemenu1" class="treeview">
<li>Opcion 1</li>
<li>Opcion 2</li>
<li>Opcion 3
	<ul>
	<li>Opcion 3.1</li>
	<li>Opcion 3.2</li>
	</ul>
</li>
<li>Opcion 4</li>
<li>Opcion 5
	<ul>
	<li>Opcion 5.1</li>
	<li>Submenu opcion 5.2
		<ul>
		<li>Opcion 5.2.1</li>
		<li>Opcion 5.2.2</li>
		</ul>
	</li>
	</ul>
</li>
<li>Opcion 6</li>
</ul>

El problema lo tengo al intentar dibujar esas opciones de la lista, sacando los valores de la tabla.

La tabla tiene la siguiente estructura: idmenu --- titulo --- idpadre --- hijo, donde si el nodo es raíz, tiene idpadre=0. El campo hijo me indica si este tiene o no descendientes, tomando valores de 1 ó 0, respectivamente.

Basándome en un ejemplo colocado en las FAQ, pensé en crear una función php que hiciera las consultas a la bd, y que "pintara" las respectivas opciones. Pero no funciona, y la verdad, como soy nueva en esto, no sé donde estoy fallando. El código de mi función php es:

Código PHP:

  <? 
 
function crearMenu($tabla,$key,$mostrar,$idpadre,$valpadre,$hijo){   
 
    $sql="select * from ".$tabla." where ".$idpadre."=".$valpadre; 
    $rs=mysql_query($sql); 
    while($arr=mysql_fetch_array($rs)){ 
        echo ('<li>'.$arr['opcion']); 
        if ($arr['hijo']==1) { 
            echo ("<ul>"); 
            crearMenu($tabla,$key,$mostrar,$idpadre,$arr['idopc'],$hijo,); 
        } 
        echo ("</li>"); 
    } 
} 
 
?>

En esa función, intento darle la estructura de la lista html, la cual se inicia y termina en la página php que la invoca, la cual es esta:

Código PHP:

  <? 
    include ("conectar.php"); 
    include ("menu2.php"); 
?> 
 
 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
<title>Documento sin t&iacute;tulo</title> 
<script type="text/javascript" src="simpletreemenu.js"> 
</script> 
 
<link rel="stylesheet" type="text/css" href="simpletree.css" /> 
 
</head> 
 
<body> 
<h4>Men&uacute; de Prueba</h4> 
 
 
<ul id="treemenu1" class="treeview"> 
<? 
    crearMenu("menu","idmenu","titulo","idpadre",0,"hijo"); 
?> 
     
</ul> 
 
<script type="text/javascript"> 
ddtreemenu.createTree("treemenu1", true) 
</script> 
 
</body> 
</html>

Espero haberme explicado y que puedan ayudarme!!

Disculpas si el post está muy largo

pateketrueke · #2 (**permalink**) 29/03/2009, 23:24

y, que es lo que no funciona de tu código??

no imprime nada??

si imprime, pero mal??

jpneruda · #3 (**permalink**) 29/03/2009, 23:35

Hola!
Es algo complicado, mas que una solución te ofrezco una aproximación de como debería ser.
Por lo pronto, no esta cerrada la etiqueta UL de crearMenu :)

En principio, deberías traer todas las categorias y subcaegorias en una sola consulta, no en la recursión, consumiría demasiados recursos. Al traerlas, las almacenas en un array multidimensional y luego la recorres para darle la jerarquía.

Tampoco sería necesario 'id_hijo' en la tabla ya que si tiene descendiente esa clave del array contendrá a otras.

Que opinás? lo codificamos?
O mejor, robamos un ejemplo :)

deadlytechnology.com/scripts/simple-recursive-php-tree-menu-example/

darlingstella · #4 (**permalink**) 29/03/2009, 23:49

Hola nuevamente y gracias por sus rápidas respuestas!!

pateketrueke, así es... no imprime nada.. me muestra la página en blanco

jpneruda, uyyy sí, no me había fijado de ese ul sin cerrar... pero ahora me queda la duda, dónde debería cerrarlo?? Porque su uso depende de si vienen más subniveles o no... entonces quedo

Lo de utilizar una sola consulta me parece genial, pero no he trabajado con arrays multidimensionales

Si puedes darme algunas indicaciones, te lo agradecería muchísimo!!!

Revisaré el ejemplo que me pasaste, y si me ayuda a solucionar el problema, ten por seguro que lo robamos... jejejejeje

Nuevamente, gracias!! Y mientras reviso el ejemplo, estoy abierta a nuevas indicaciones!!

Ahhh uno de los links del ejemplo no sirve!!!

Qué falla!!!

#5 (**permalink**) 30/03/2009, 01:15

Hola!!!

A ver, yo estoy/ estaba haciendo algo similar... aunque no esta completo, hace falta ver como manejar los enlaces... por si te sirve...

Código php:

Ver original<?php
        $menu_nombre=array(0=>"Programacion",1=>"Consolas y Juegos",2=>"PC",
                            3=>"Multimedia",4=>"General");
        $menu_nombre_sub=array(0=>array("PHP","JAVASCRIPT","C/C++","CSS"),
                                1=>array("Xbox 360","PS3","WII","General"),
                                2=>array("Hardware","Software","General"),
                                3=>array("Video","Muscia","Cine"),
                                4=>array("Deporte","Motor","Tecnologia"));
                                
        for($index=0;$index<count($menu_nombre);$index++)
        {
            echo "<li><a href=''>".$menu_nombre[$index]."</a>";
            if ($index<count($menu_nombre_sub))
            {
                if(count($menu_nombre_sub[$index]!=0))
                {
                    echo "<ul>";
                    for($index_2=0;$index_2<count($menu_nombre_sub[$index]);$index_2++)
                    {
                     echo "<li><a href=''>".$menu_nombre_sub[$index][$index_2]."</a></li>";
                    }
                    echo "</ul>";
                }
            }
            echo "</li>";
        }
        ?>

pateketrueke · #6 (**permalink**) 30/03/2009, 01:47

no imprime nada, de nada??

ni el poco HTML que lleva el documento??

esta raro... si lo que no imprime es donde va el PHP ... es porque debes usar <?php en lugar de solo <?

darlingstella · #7 (**permalink**) 30/03/2009, 09:05

Hola!!

pateketrueke, así es, nada de nada, la página completamente en blanco...

por eso es que tengo la gran incógnita, porque no muestra absolutamente nada!!

machoman112233, gracias por tu idea. Intentaré adaptarla a mi caso, porque yo debo sacar las opciones de los menús desde la tabla menú en mysql, y podría tener muchos más niveles, de hecho, necesito que la función me tome n niveles, que funcione sin importar la profundidad del árbol.

Estoy a la espera de nuevas opciones... help me please, que ya estoy al borde de un colapso!!

Gracias!

pateketrueke · #8 (**permalink**) 30/03/2009, 09:34

bueno, ese es el primer problema...

si no se imprime nada, por favor, asegurate que puedes ejecutar un script de PHP antes de aventurarte con uno...

o bien, que estas cargando el script correcto....

digo, hay que ser coherentes!

vale??

darlingstella · #9 (**permalink**) 30/03/2009, 09:59

Hola!

Sí claro, todo eso está bien. Tiene el script adecuado, tanto php como js.

darlingstella · #10 (**permalink**) 30/03/2009, 14:45

Listo!! He arreglado mi problema. Como tenía problemas con la función, debido a que la tenía genérica, pues la acomodé a mi tabla específica, para salir del apuro del momento, jejejeje. Pero no me rendiré para tenerla genérica!!

Les paso mi solución, por si a alguien le interesa.

Código PHP:

  <?php 
 
function crearMenu($valpadre){   
 
    $sql="select * from menu where idpadre=".$valpadre; 
    $rs=mysql_query($sql); 
    while($arr=mysql_fetch_array($rs)){ 
        echo ('<li>'.$arr['opcion']); 
        if ($arr['hijo']==1) { 
            echo ("<ul>"); 
            crearMenu($arr['idopc']); 
            echo ("</ul>"); 
        } 
        echo ("</li>"); 
    } 
} 
 
?>

Y en mi página principal, sólo llamo a la función pasándole el id de la raiz, que en la tabla lo tengo como 0.

Código PHP:

  <?php 
    include ("conectar.php"); 
    include ("menu2.php"); 
?> 
 
 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
<title>Documento sin t&iacute;tulo</title> 
<script type="text/javascript" src="simpletreemenu.js"> 
</script> 
 
<link rel="stylesheet" type="text/css" href="simpletree.css" /> 
 
</head> 
 
<body> 
<h4>Men&uacute; de Prueba</h4> 
 
 
<ul id="treemenu1" class="treeview"> 
 
<?php 
    crearMenu(0); 
?> 
     
</ul> 
 
<script type="text/javascript"> 
//ddtreemenu.createTree(treeid, enablepersist, opt_persist_in_days (default is 1)) 
ddtreemenu.createTree("treemenu1", false) 
</script> 
 
</body> 
</html>

Gracias a todos!!