Cómo mostrar un array de PHP en una tabla HTML

Los arreglos (o arrays) en PHP son, por lejos, la estructura de datos más utilizada.

A diferencia de otros lenguajes, los de PHP son altamente flexibles (no tienen una longitud predeterminada, pueden albergar datos de diferente tipo, etc…).

Una necesidad bastante común cuando se trabaja en desarrollo de aplicaciones web es la visualización del contenido de un arreglo en forma de tabla HTML.

El ejemplo más claro es cuando el arreglo contiene los resultados de una consulta a una base de datos.

Existen varios modos de lograr esta visualización. A continuación verás algunos de ellos, asumamos que todos los ejemplos comienzan con la definición del arreglo:

<?php

$a = [
        [
                'Nombre' => 'Mauro',
                'Apellido' => 'Chojrin',
                'Correo' => 'mauro.chojrin@leewayweb.com',
        ],
        [
                'Nombre' => 'Alberto',
                'Apellido' => 'Loffatti',
                'Correo' => 'aloffatti@hotmail.com',
        ],
        [
                'Nombre' => 'Foo',
                'Apellido' => 'Bar',
                'Correo' => 'foo_bar@example.com',
        ]
];

En rigor de verdad, se trata de una matriz (Arreglo de arreglos) pero lo uso para hacer algo más realistas los ejemplos… si fuera un arreglo unidimensional sería ligeramente más sencillo.

En cualquiera de los casos lo que se obtendrá será:

Mostrar una tabla HTML usando PHP puro

La primera forma es hacerlo 100% en PHP:

$s = '<table border="1">';
foreach ( $a as $r ) {
        $s .= '<tr>';
        foreach ( $r as $v ) {
                $s .= '<td>'.$v.'</td>';
        }
        $s .= '</tr>';
}
$s .= '</table>';

echo $s;

En este caso lo que se ve es cómo se recorre el arreglo y se va conctatenando todo el HTML en el string $s, el cual es emitido al final.

Otra forma ligeramente diferente de hacerlo es realizar los echo directamente:

echo '<table border="1">';
foreach ( $a as $r ) {
        echo '<tr>';
        foreach ( $r as $v ) {
                echo '<td>'.$v.'</td>';
        }
        echo '</tr>';
}
echo '</table>';

Mostrar una tabla usando PHP dentro de HTML

La segunda forma es mezclar HTML con PHP:

<table border="1">
<?php
foreach ( $a as $r ) {
        ?>
        <tr>
        <?php
        foreach ( $r as $v ) {
        ?>
                <td><?php echo $v;?></td>
        <?php
        }
        ?>
        </tr>
<?php
}
?>
</table>

Este código debe escribirse en un archivo .php (a pesar de que la gran mayoría de su contenido sea sólo HTML) para que el servidor web lo interprete correctamente.

Esta es una de las características interesantes que tiene php respecto de otros lenguajes (al menos en lo que al desarrollo web respecta).

Cuando el intérprete lee la secuencia de escape ?> se limita a enviar todo lo que aparece sin hacer ningún tipo de análisis (Hasta que vuelve a aparecer <?php). Esto es lo que permite embeber código de otros lenguajes dentro del de PHP.

A simple vista puede parecerte algo más molesto (eso de estar abriendo y cerrando php todo el tiempo) pero piensa en las ventajas que te da:

  1. Está más claramente separada la lógica de la presentación (Lo que es HTML es HTML y lo que es PHP es PHP).
  2. Los editores de texto (IDEs especialmente) serán capaces de diferenciar claramente el HTML del PHP y de esa forma marcar errores específicos).

Un punto que se deriva del primero es que de esta forma es más fácil trabajar con otros miembros del equipo que no sepan de php pero si de HTML (Por ejemplo diseñadores gráficos).

Una pequeña variante que a veces se utiliza para esto es:

<table border="1">
<?php
foreach ( $a as $r ):
        ?>
        <tr>
        <?php
        foreach ( $r as $v ):
        ?>
                <td><?php echo $v;?></td>
        <?php
        endforeach;
        ?>
        </tr>
<?php
endforeach;
?>
</table>

Este tipo de aproximación es la que toman los frameworks y motores de templating (como Twig por ejemplo).

Es una buena práctica separar el código que hace a la presentación de aquel que hace a la lógica (Conexión a la base de datos, ejecución de consultas, etc…).

¿Te interesa conocer más sobre PHP? Este curso te puede ayudar.

mchojrin

4 comentarios en “Cómo mostrar un array de PHP en una tabla HTML

  • German Ramirez

    Buenas tardes, mi duda es la siguiente, tengo una array de la siguiente manera:
    $arreglo_1=array(
    array (dato1, dato2, dato3, colorcafe),
    array (dato1, dato2, dato3, colorrojo),
    ); // dato 4 imaginemos que es el nombre de un color como lo escribo ahí

    y tengo otro array donde le doy un valor al color ejemplo:
    $arreglo_2=array(
    ‘colorcafe’=>»campo y sabor»,
    ‘colorazul’=>»agua y mar»,
    ); // estos serian los colores con valor

    tengo una tabla la cual me muestra los valores del arreglo 1 y creo una ultima columna para que me muestre el signficado del color

    como hago para que el valor del arreglo_1 referente al colorcafe «para ejemplo» me ingrese una nueva columna donde me diga el significado el cual esta en el arreglo_2 y cuy valor es «campo y sabor» y el color que no tenga significado se imprima un valor que diga no tiene signficado?.

    se que se debe hacer con una sentencia if pero no he logrado que se evalue los campos, gracias

    • Hola Germán:

      Gracias por tu pregunta. Para empezar, te sugiero usar una versión más nueva de php o, en todo caso, usar la notación moderna de definición de arreglos ($arreglo = [valor1, valor2]).

      Yendo a tu pregunta, puedes resolverlo de varias formas diferentes.

      La mejor a mi modo de ver es utilizar la función array_search.

      La idea sería recorrer todo el arreglo_1 y, por cada elemento, realizar una búsqueda dentro del arreglo_2.

      Exitos!

      • German Ramirez

        Gracias por la respuesta, lo he practicado pero sigo sin tener el resultado, será que estaré aplicando mal la sentencia?

        // un foreach para imprimir en tabla los valores del arreglo_1
        foreach ($arreglo_1 as $r) {
        echo »;
        foreach ($r as $v) {
        echo » . $v . »;
        }

        // Genenarando la comparacion con el uso de array_search para identificar el significado del color
        if(array_search($arreglo_1, $arreglo_2)){
        $v = $arreglo_2;
        }else {
        $v = "no esta el significado";
        }

        // Linea de codigo encargada de imprimir los resultados de array_search
        echo '<td width="15%">'. $v . '</td>';
        }

        al correr el codigo me imprime «»no esta el significado»», por lo cual me desconoce unos de los colores que si esta que es el color cafe?, tendré algo mal en la sintexis?

        • Ahora que veo más de cerca tu código creo que ni siquiera necesitas array_search.

          Aquí tienes un ejemplo que espero te ayude:

          <?php

          $arreglo_1 = [
          ['dato1', 'dato2', 'dato3', 'colorcafe'],
          ['dato1', 'dato2', 'dato3', 'colorrojo'],
          ];

          $arreglo_2 = [
          'colorcafe'=>'campo y sabor',
          'colorazul'=>'agua y mar',
          ];

          ?>

          <table>
          <tbody>
          <?php
          foreach ( $arreglo_1 as $r ):
          ?>
          <tr>
          <td><?php echo $r[0];?></td>
          <td><?php echo $r[1];?></td>
          <td><?php echo $r[2];?></td>
          <td><?php echo array_key_exists($r[3], $arreglo_2) ? $arreglo_2[$r[3]] : 'N/A' ?></td>
          </tr>
          <?php
          endforeach;
          ?>
          </tbody>
          </table>

¿Te quedó alguna duda? Publica aca tu pregunta

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.

A %d blogueros les gusta esto: