Mi Pedacito De Internet: Ingresar datos en una Tabla Dinámica de Forma Manual. (html y php)

Quiero empezar con este blog, con un aporte que me acaba de servir mucho. Agradecimientos a las personas que me ayudaron con esto.

Para empezar, en lenguaje html, vamos a entender una tabla dinámica como una tabla, cuya cantidad de filas no se puede precisar. O sea que no se sabe cuantas filas va tener, y por lo tanto se utiliza el lenguaje php o algún otro lenguaje de programación orientado a web, para ir insertando las filas, normalmente usando un ciclo FOR u otro ciclo repetitivo.
Existen una serie de tutoriales en internet en donde nos explican como crear una tabla dinámica a partir de datos almacenados en una base de datos. Por ejemplo:

Video para crear tablas dinamicas usando php

En mi caso, yo pretendo crear una tabla dinámica, cuyos datos sean ingresados manualmente por medio de campos de texto o etiquetas <input> y mediante un botón sean añadidos a la tabla.

Así que manos a la obra, inicialmente tenemos el siguiente formulario:


<!DOCTYPE html>

<html>

<head>

<title>PRUEBA</title>

</head>

<body>

<form name="alumno" method="post" action="<?php $PHP_SELF ?>">

<label>Nombre:</label>

<input type="text" size="25" maxlength="50" name="nombre">

<label>Edad:</label>

<input type="number" name="edad">

<input type="submit" value="Anadir">

</form>

<table border="1">

<tr>

<th>Nombre:</th>

<th>Edad:</th>    

</tr>

</table>

</body>

</html>

Con este código obtenemos un formulario muy básico, que consta de dos campos de texto, un bóton que nos va servir para añadir los datos a la tabla, la cual está debajo de los campos.

Bien, lo primero que vamos a hacer es añadir una etiqueta input de tipo "hidden" al formulario, este nos va servir para indicarle a php, que estamos añadiendo registros a la tabla. Lo colocamos entonces dentro del formulario así:



<form name="alumno" method="post" action="index1.php">

<input type="hidden" value="anadir" name="accion">

Ahora lo que sigue es añadir el código PHP que se va encargar de hacer la magia. Lo que tenemos que hacer es comprobar el valor que tiene "accion" (o sea la etiqueta input que acabamos de añadir) y dependiendo de eso, así va ser la acción que se va realizar. Por ejemplo si "acción" es igual a " " o está vacío, quiere decir que es la primera vez que la página se carga, por tanto es buen momento para crear una variable "contador" que se encargue de controlar la posición de una matriz "datos" que vamos a usar para almacenar los registros que se van a mostrar en la tabla. Cabe mencionar que estas variables "contador" y "datos" deben ser variable de sesión, para que al recargar la página no se pierdan los datos. La porción de código a añadir sería la siguiente: (Añadir al principio del código)


<?php

session_start();

if($_POST['accion']=="") {

$_SESSION['contador']=0;

}

if($_POST['accion']=="anadir") {

$_SESSION['datos'][$_SESSION['contador']][0]=$_POST['nombre'];

$_SESSION['datos'][$_SESSION['contador']][1]=$_POST['edad'];

$_SESSION['contador']=$_SESSION['contador']+1;

}

?>

Usamos session_start() para recuperar las variables de sesión, luego se comprueba el valor de accion. Cuando está vacío quiero decir que es la primera vez que se carga la página, por lo que se crea el contador que va manejar las posiciones de la matriz datos donde están almacenados los registros que se van a mostrar en la tabla. Cuando accion tiene el valor de "anadir", quiero decir que ya se presionó por lo menos una vez el botón Añadir y por tanto ya hay un dato que se debe mostrar. Estos datos se almacenan en la matriz datos y se aumenta en uno el contador.

Ahora solo resta mostrar los registros en la tabla, y para ello solo basta con recorrer la matriz e ir mostrando los datos que contiene. Así:


<table border="1">

<tr>

<th>Nombre:</th>

<th>Edad:</th> 

</tr>

<?php

for($i=0;$i<$_SESSION['contador'];$i++) {

echo "

<tr>

<td>".$_SESSION['datos'][$i][0]."</td>

<td>".$_SESSION['datos'][$i][1]."</td>

</tr>

";

}

?>

</table>

De esta manera tenemos una tabla a la que se le pueden insertar registros de forma manual. Si luego se desea almacenar estos datos en una base de datos solo se debe trabajar con la matriz. Posteo tambien el archivo php con el código completo. Si le has gustado este post comenten :)

Descargar arhivo php