Formulario de ejemplo

Recuerdas la base de datos que creamos pginas atrs? Vamos a crear un

formulario en el que pediremos al visitante los datos de aquella tabla USUARIOS
que habamos creado en el ejemplo aqul. Los campos que tenamos en esa tabla
eran NOMBRE, EMAIL, URL y ACTIVO. Tenamos un campo ms llamado ESTADO.
Obviamente este no ser un campo a relenar por el usuario, as que podemos
establecerlo nosotros con el valor Activo y ya ms tarde si se porta mal lo
ponemos como Inactivo. Este sera una buena ocasin para aplicar lo del campo
oculto, verdad? Aadiremos este campo como oculto en el formulario con el valor
de Activo entonces. Sin ms rollo vamos a ver cmo pasamos todo eso a cdigo
Html.
Damos por hecho que ya tienes creada la base de datos del ejemplo que
dejamos atrs, con la tabla aquella llamada USUARIOS con los campos NOMBRE,
EMAIL, URL y ESTADO.
Para empezar escribimos las etiquetas de inicio y fin del formulario:
< form method="post" action="mostrardatosenpagina.php">
< /form>

Ahora colocamos dentro los cdigos Html correspondientes a cada uno de los
campos. Para NOMBRE por ejemplo, que es una cadena de texto de una sola
lnea, pondremos estas lneas:
< input type="text" name="Nombre" value="Escribe tu nombre" size=30
maxlength=50 />

Si recuerdas, cuando creamos hace unas cuantas pginas la tabla USUARIOS

indicabamos en el PhpMyAdmin que el campo Nombre deba tener como mximo
50 carcteres. Lo pusimos en esta tabla, te acuerdas?

As que en el cdigo del formulario pondremos un maxlenght de 50. De este

modo no nos dejar escribir ms que esos carcteres. Total, tampoco los tomara
la base de datos.

El valor de SIZE en cambio no varia ni recorta ese valor por largo que sea, solo
indica la anchura del recuadro del formulario, as que lo dejamos en por ejemplo
30.
< form method="post" action="mostrardatosenpagina.php">
<input type="text" name="Nombre" value="Escribe tu nombre" size=30
maxlength=50 />
< /form>

Pasamos a los siguientes campos, EMAIL y URL. Son iguales que el campo
NOMBRE anterior, por lo que modificamos solamente el valor VALUE para indicar
lo que queremos que aparezca junto con el formulario en cada hueco. Quedara
as:
< form method="post" action="mostrardatosenpagina.php">
<input type="text" name="NOMBRE" value="Escribe tu nombre" size=30
maxlength=50 />
<input type="text" name="EMAIL" value="tuemail@correcto" size=30 maxlength=50 />
<input type="text" name="URL" value="http://www.tudirecciondepagina.web"
size=30 maxlength=50 />
< /form>

Nos falta solo el campo oculto en cuyo cdigo ponemos ya que tenga el valor
ACTIVO, quedando as el cdigo hasta ahora:
< form method="POST" ACTION="mostrardatosenpagina.php">
<input type="text" name="NOMBRE" value="Escribe tu nombre" size=30
maxlength=50 />
<input type="text" name="EMAIL" value="tuemail@correcto" size=30 maxlength=50 />
<input type="text" name="URL" value="http://www.tudirecciondepagina.web"
size=30 maxlength=50 />
<input type="hidden" name="ESTADO" value="Activo" />
< /form>

El aspecto del formulario sera este:

tuemail@correcto

http://www.tudirecciondepagina.w

Y si queremos que aparezcan esos recuadros uno bajo el otro podremos una
etiqueta <br /> que indica salto de lnea, al final de cada lnea de INPUT,
quedando as:
Escribe tu nombre
tuemail@correcto
http://www.tudirecciondepagina.w

Hey! Le faltan los botones an! je je. Veamos, con las lneas de cdigo del
botn de envo quedara as:
< form method="POST" action="mostrardatosenpagina.php">
<input type="TEXT" name="NOMBRE" value="Escribe tu nombre" size=30
maxlength=50><br />
<input type="TEXT" name="EMAIL" value="tuemail@correcto" size=30
maxlength=50><br />
<input type="TEXT" name="URL" value="http://www.tudirecciondepagina.web"
size=30 maxlength=50><br />
<input type="HIDDEN" name="ESTADO" value="Activo">
<input type="SUBMIT" value="Botn de envio estandar" name="Enviar la informacin
al servidor"><br />
< /form>

Y el aspecto sera este:

Escribe tu nombre
tuemail@correcto
http://www.tudirecciondepagina.w

Botn de envio estandar

Bonito verdad? Je je je. Ya sabes que con imaginacin, gusto y..... y la hoja de
estilos! puedes dar un aspecto mucho mejor al formulario.

Uso de la informacin del formulario en otras pginas

de la web
Qu hace realmente este formulario cuando se pulsa el botn de envo? Te lo
cuento paso a paso, oki? Tras pulsar el botn, los tres valores o mejor dicho, los
cuatro valores (tambin tenemos el valor oculto!) se quedan guardados en una
variable del tipo cadena.
Un tipo cadena significa que esos cuatro valores se quedan guardados "en
cadena", es decir, uno detrs de otro. La variable que los guarda mantiene esos
datos as:
NOMBRE, Escribe tu nombre,
EMAIL, tuemail@correcto,
URL, http://www.tudirecciondepagina.web,
ESTADO, Activo

Como ves, estn en cadena. Se queda guardado el nombre (NAME) del botn
junto con el valor que se haya escrito en el formulario. Vers tambin como se ha
guardado el campo oculto, con su nombre ESTADO y el valor que hemos puesto
predeterminado en el cdigo del formulario, Activo.
Para recuperar esa informacin o mejor, para imprimirla en la ventana del
navegador tenemos que hacer un echo, como siempre, y llamar a la variable que
contiene esos datos con la siguiente lnea de cdigo Php:
< ?php
echo $_POST[NAME];
?>

donde en lugar de NAME tenemos que colocar el nombre de ese campo, como por
ejemplo, NOMBRE, ESTADO, URL o EMAIL. Por ejemplo, para el cdigo Php de
arriba se mostrara en la ventana del navegador esto:
Francisco Gonzalez

suponiendo claro que se escribi ese nombre en el formulario antes de pulsar

el boton de envo.
Si en lugar de haber puesto el valor POST en la primera lnea del cdigo del
formulario, hubieramos escrito GET (te dije que podiamos usar cualquiera de los
dos, recuerdas?) los datos del formulario se habran guardado no en la variable
POST sino en la variable GET, por lo que para imprimir los datos del formulario
tendramos que haber escrito este otro cdigo Php:
< ?php
echo $_GET[NAME];
?>

Adems de eso, el usuario vera en la direccin de la pgina de destino no solo

la informacin que escribi, sino tambin los valores de campos ocultos y eso a
veces no es deseable, no? El formulario siguiente es igual que el anterior pero
con GET en lugar de POST. Pulsa el botn de envo y vers esa informacin al
final de la direccin que muestra tu navegador.
Escribe tu nombre
tuemail@correcto
http://www.tudirecciondepagina.w

Botn de envio estandar

Y como te deca al principio de estas lecciones, como los navegadores

normalmente no son capaces de leer una direccin o URL demasiado larga, si los

datos son muchos o muy largos el navegador no podr leer los ultimos datos y
perderas informacin del formulario. As que, por el momento seguiremos
usando POST en lugar de GET y tan contentos.
Al pulsar sobre los botones de envo de estos ejemplos anteriores, se te dirije a
una pagina escrita en Php cuyo nico contenido es este:
< ?php
echo "Hey, que esto an no est terminado!" ;
echo $_POST[ESTADO] ;
?>

De forma que se ve en el navegador el mensaje "Hey, que esto an no est

terminado!" seguido de lo que vale la variable ESTADO, es decir, Activo.
Esta pgina se llama mostrardatosenpagina.php y es la que aparece en la
primera lnea del cdigo Php de estos formularios de ejemplo. Osea, que la
pgina que pongamos all ser la que reciba los datos del formulario. Que hacer
con esos datos ya es otro cantar, verdad? En este ejemplo lo que hemos hecho
con los datos del formulario ha sido simplemente mostrar en pantalla el valor del
campo oculto ESTADO. Ms adelante en lugar de esa tontera lo que
aprenderemos es a guardar todos ellos en una base de datos.

Guardar la informacin de formulario en una base de

datos
Antes vimos cmo aprovechar la informacin del formulario para imprimir
alguno de sus datos en una pgina web. Ahora lo que vamos a aprender es a que
tras pulsar el botn de envo, todos esos datos queden guardados en una base de
datos que tendremos ya creada y preparada para recibir esa informacin.

El formulario va a ser el mismo que antes, sin cambiarle nada. La novedad en

este caso ser el indicar al servidor que guarde los valores de la variable POST en
nuestra base de datos de ejemplo, la que vimos al principio.
Bueno s cambia una cosilla, el nombre del archivo php de la primera lnea del
cdigo del formulario. Antes era la pgina mostrardatosenpagina.php y contena
instrucciones para mostrar una frase y el valor del campo oculto mientras que
ahora ser otro archivo distinto llamado por ejemplo insertardatosentabla.php y

que ser el que vamos a crear ahora y que contiene las instrucciones para que el
servidor guarde los datos del formulario recibidos a travs del POST, en la tabla
USUARIOS de nuestra querida base de datos.
Y a estas alturas siento decirte que.... ya no eres normal. Ahora empiezas a ser
todo un friki programador, de esos que no hay quien los entienda, ja ja ja ja. Es
broma!! Solo t te libras! ja ja ja ja. Hey, qu tal un paseito (no virtual, que te
veo venir!) para mover el esqueleto antes de continuar?

Jugando con los Datos

Para poder jugar con la informacin de una base de datos es imprescindible
primero conectar con ella. Con jugar con la informacin me refiero a mostrar,
insertar, crear, modificar o eliminar datos. Nosotros tenemos ya preparados los
datos en la variable post que vimos, pero antes de insertar esos datos en la base
de datos necesitamos conectar con ella.
Los datos de conexin los tenemos ya y si me has hecho caso, los tendrs a
mano escritos en algn papelito por tu mesa. Si no es as, te los recuerdo:
Nombre de la base de datos: cartago_basedepruebas
Nombre de usuario de la base de datos: cartago_pepe
Contrasea: noteladigo
Host: localhost

En tu caso, en lugar de cartago tendrs que poner tu nombre de usuario del

Cpanel tal y como te dije, adems de tu propia contrasea, claro.
Ls lneas de cdigo Php que has de poner para abrir la conexin con esa base
de datos son estas (en adelante coloreo de gris aquellas lneas que no son ms
que comentarios aclaratorios, oki? Para distinguirlo del resto de cdigo php):
< ?php
// Rellena los espacios ente comillas de abajo con los datos que te da
// el servidor al activar la base de datos.
// Este dato de abajo suele ser localhost casi siempre:
$server="localhost";
// Aqui abajo escribe el nombre de la base de datos.
// Si tu servidor tiene cpanel normalmente va primero tu nombre de username,
// por ejemplo: username_nombredelabasededatos
$database = "cartago_basedepruebas";
// Aqui abajo el nombre de username de la base de datos para acceder a ella.
$db_user = "cartago_pepito";

// Y ahora la contrasea:
$db_pass = "servicio23";
?>

Las lneas de cdigo realmente importantes son solo las que no llevan el
smbolo // delante, pues esas son simples comentarios que si quieres puedes
mantener (te lo recomiendo) para recordar para que sirve cada una de ellas.
Realmente son solo cuatro las lineas importantes y en ellas se guardan en
variables los datos de conexin.
Podras pensar que es un poco arriesgado dejar guardados los datos de la base
de datos, con la contrasea y todo, en un archivo colgado en internet, pero como
es cdigo Php no hay riesgo alguno. Por qu?
Si recuerdas lo que te comentaba al principio de hablarte del Php, es un cdigo
que solo lee el servidor de forma que, como no tenemos ningn echo en estas
lneas, el resultado de todo este cdigo en un navegador ser nada, cero,
ninguno. Esos datos son leidos por el servidor, pero es imposible que cualquier
usuario pueda leerlos, as que tranquilo.
Para no tener que escribir esas lneas cada vez que queramos abrir la conexin
a la base de datos lo que haremos es guardar todo ese cdigo en un archivo que
llamaremos config.php y al que llamaremos cada vez que queramos abrir la base
de datos (ya te digo cmo).
Abre por tanto tu block de notas, escribe todo ese cdigo dentro, cambia los
valores por los tuyos (la contrasea y la palabra cartago por tu nombre de
usuario en el Cpanel) y guarda el archivo con la extensin .php en la raiz de la
carpeta en la que ests haciendo este ejemplo, vale? Ahora crea otro archivo
ms, tambin con extensin .php llamado insertardatosentabla.php
Como ese archivo es Php puedes ya escribir sus etiquetas de apertura y cierre.
Ya dijimos que las pginas Html empezaban con la etiqueta <html> y terminaban
con </html> y que en cambio los archivos Php empezaban con <?php y
terminaban con ?> as que escribe eso dentro y guarda los cambios.
En este archivo llamado insertardatosentabla.php escribiremos el cdigo Php
necesario para incluir los datos guardados en la variable post dentro de la base
de datos de ejemplo. Como adivinars, lo primero es conectar con la base de
datos.
Para ello deberamos escribir el cdigo Php que habamos guardado en el
archivo config.php pero como lo tenemos en aqul archivo, basta con indicar
que aada todo su contenido en esta otra pgina. Esto se hace muy rapidamente
usando la palabra mgica include tal y como te muestro abajo:

<?php include("config.php") ; ?>

Con esto el servidor leer el contenido de config.php cuando vea la lnea del
include y de este modo nos ahorramos escribir ese cdigo cada dos por tres. Una
vez que lo ha leido ya conoce las claves para la conexin. Ahora le indicamos que
conecte con estas otras lneas:
< ?php
// leer datos de usuario y contrasea de la base de datos
include("config.php") ;
// Conexin con el servidor
mysql_connect($server, $db_user, $db_pass) or die ("error1".mysql_error());
// Seleccin de Base de Datos
mysql_select_db($database) or die ("error2".mysql_error());
?>

Los comentarios (las he diferenciado con otro tono de color arriba), es decir,
las lneas que empiezan por // hablan por si solas, no? La primera nueva lnea
conecta con el servidor y la segunda con la base de datos.
Si por algn motivo falla la conexin con el servidor, se mostrar en el
navegador el mensaje "error1" y se deber seguramente a haber puesto mal el
nombre del servidor, de usuario o la contrasea en el archivo config.php
Si lo que falla es la seleccin de la base de datos, aparecer en la pantalla
"error2" y ser seguramente por haber escrito mal el nombre de la base de datos
en el archivo config.php
Si no aparece ninguno de esos mensajes ser que todo ha ido como
esperabamos, aunque no lo notaremos por el momento. Lo importante ser saber
que la conexin est hecha!!!
Solo nos queda indicar al servidor mediante el cdigo Php que inserte los datos
guardados en POST en la tabla USUARIOS. Esto se hace con esta sencilla lnea de
cdigo:
mysql_query (" INSERT INTO base.tabla (nombre de los campos) values (datos
correspondientes) ");

que en nuestro caso tomara la forma siguiente:

mysql_query ("INSERT INTO `cartago_basedepruebas`.`USUARIOS` (`NOMBRE`,
`EMAIL`, `URL`, `ESTADO`) VALUES ('$_POST[NOMBRE]', '$_POST[EMAIL]',
'$_POST[URL]', '$_POST[ESTADO]') ");

En esa lnea no hay nada raro, no? Se pone el nombre de tu base de datos, un
punto, el nombre de la tabla y luego dentro del primer parntesis el nombre de
los campos y dentro del segundo parntesis las palabras mgicas $_POST[nombre
de campo], una para cada campo que rescatamos del formulario.
Pues con eso queda guardada la informacin del formulario en nuesta base de
datos. Qu tal? Te ha parecido muy complicado? Imagino que no. Quizs muy
diferente a trabajar con Html, no? Pero te aseguro que hace tres das no sabia
nada de Php, bases de datos ni de formularios y mira, aqu estoy explicndote
cmo se usan, je je. Es cierto, tras unos cuantos ejemplos y testeos se me ha
quedado bien grabado en la cabeza, no es muy dificil.
An se pueden hacer miles de cosas con los valores guardados en la base de
datos. Solo necesitamos aprender un poco ms y podremos crear nuestros propios
foros, sistemas de mensajes, de noticias, hacer ms dinmicas nuestras webs
dotndolas de registro de usuarios, etc, etc, etc. Pero sigamos poco a poco, je je
je.
Escribe tu nombre
tuemail@correcto
http://www.tudirecciondepagina.w

Botn de envio estandar