Cómo crear un menú tipo árbol con PHP y MySQL

Escrito por laura gittins | Traducido por juliana star
  • Comparte
  • Twittea
  • Comparte
  • Pin
  • E-mail
Cómo crear un menú tipo árbol con PHP y MySQL
Un menú de árbol es una representación visual de una lista de elementos. (Comstock/Comstock/Getty Images)

Un menú de árbol es una representación visual de una lista de elementos, organizados de manera que algunos elementos o categorías, llamados nodos padre, puedan expandirse y mostrar subelementos, llamados nodos hijos. Usando PHP puedes obtener información de una base de datos de MySQL y construir un menú de árbol en una página web. Tu tabla de MySQL debe tener un formato específico, uno que identifique los nodos padres e hijos y la relación entre ellos. Cada registro de la tabla representa un nodo del árbol. Puedes crear varios niveles de nodos hijos.

Nivel de dificultad:
Moderadamente fácil

Otras personas están leyendo

Instrucciones

  1. 1

    Inicia sesión en tu base de datos de MySQL. Crea una tabla con tres campos: el ID del nodo, el texto para el nodo y el ID del nodo padre. Inserta información en la tabla. Cada ID de nodo debe ser único. Los nodos del nivel superior tienen un valor de cero en el ID del nodo padre, mientras que los nodos hijos tienen un ID de padre que se ajusta al campo ID de los nodos padre respectivos.

  2. 2

    Abre el archivo HTML en el que quieras crear un menú de árbol. Inserta el cursor en donde quieras mostrar el árbol y escribe el siguiente código:

    <?php $db = mysql_connect ($hostname, $username, $password); mysql_select_db ($database);

    Estas líneas simplemente configuran la conexión a tu base de datos de MySQL. Sustituye las variables de PHP por aquellas que correspondan a tu base de datos.

  3. 3

    Escribe la siguiente instrucción:

    $result = mysql_query("SELECT * FROM table_name") or die(mysql_error());

    Esta línea hace una llamada a la base de datos de MySQL, obtiene los datos de la tabla que contiene la información para el menú de árbol y los guarda en una variable de PHP.

  4. 4

    Escribe el siguiente código:

    $menu = Array(); while ($m = mysql_fetch_array($result)) { $menu[] = Array('id'=>$m['id'], 'text'=>$m['text'], 'parent'=>$m['parent']); }

    La primera línea crea una variable de PHP y la inicializa como un arreglo. El ciclo "while" recorre cada uno de los registros de la variable "$result" y les da un formato que permite su uso mediante una función de PHP.

  5. 5

    Escribe las siguientes instrucciones:

    function treemenu($rows,$parent=0) { $result = "<ul>"; foreach ($rows as $row) {

    La primera línea crea una nueva función llamada "treemenu" que usarás para construir tu árbol. Esta recibe uno o dos parámetros. El primero toma la información de un arreglo de PHP y el segundo es un entero que contiene información acerca de los nodos padre en el árbol. Si no envías un segundo parámetro, la función crea su propia variable e inicializa su valor con un cero.

  6. 6

    Escribe las siguientes instrucciones:

    if ($row['parent'] == $parent) { $result.= "<li>{$row[text]}"; foreach ($row as $r) { if ($r['parent'] == $r['id']) $children = true; else $children = false; } if ($children = true) $result.= treemenu($rows,$row['id']) . "</li>"; }

    Estas líneas de código usan instrucciones "if" y ciclos para desplazarse a través de la información en la variable de PHP que contiene la estructura del menú de árbol. Si la fila es un padre con un valor ID de cero la función crea un nodo padre. Si la fila es un hijo la función obtiene el ID del nodo padre y crea un nodo hijo vinculado a su padre. A continuación invoca a la función "treemenu" de forma recursiva para revisar cada fila encontrada en la variable de tipo arreglo de PHP.

  7. 7

    Escribe el siguiente código:

    } $result .= "</ul>"; return $result; }

    Estas líneas cierran el ciclo "for" que se mueve a través de cada fila de los resultados de MySQL, agrega un poco de código HTML y regresa como resultado el árbol desde la función. La última línea cierra el bloque de la función "treemenu".

  8. 8

    Escribe las siguientes líneas de código:

    echo treemenu($menu); ?>

    La primera línea invoca a la función "treemenu" y le envía la información desde la base de datos de MySQL. A continuación imprime el árbol en la página web. La segunda línea cierra el bloque de código PHP.

Consejos y advertencias

  • Agrega más campos en tu tabla de MySQL según sea necesario. Por ejemplo, puedes agregar otro campo de texto que almacene hipervínculos para cada nodo.

No dejes de ver

Filtrar por:
  • Mostrar todos
  • Artículos
  • Galerías de fotos
  • Videos
Ordenar:
  • Más relevante
  • Más popular
  • Más reciente

No se encuentran artículos disponibles

No se encuentran slideshows disponibles

No se encuentran videos disponibles