MINI MANUAL PARA CREAR FORMULARIOS CON PHP
Marzo 2007
Servicio de Informática y
Comunicaciones
Mini manual para crear formularios con PHP Servicio de Informática y Comunicaciones
2
Para poder diseñar un formulario y que éste nos envíe los resultados a nuestro correo electrónico, necesitamos crear
3 páginas con nuestro programa editor de webs. Para este ejemplo vamos a utilizar Microsoft Office FrontPage 2003.
PÁGINA 1: EL FORMULARIO
Después de iniciar el FrontPage abrimos nuestro sitio web; posteriormente vamos a archivo y seleccionamos la opción «nuevo». Después elegimos «página en blanco» tal como se muestra:
Mini manual para crear formularios con PHP Servicio de Informática y Comunicaciones
3
Como resultado de esta acción nos mostrará una pantalla parecida a esta:
Si observa atentamente la parte inferior de la imagen anterior observará esto:
Esto significa que usted va a ver, por un lado el código fuente de la página:
Mini manual para crear formularios con PHP Servicio de Informática y Comunicaciones
4
Y por otro verá la vista de diseño:
Ahora pulsamos con el botón izquierdo del ratón en medio de la zona correspondiente a la vista de diseño para indicarle al programa que queremos trabajar en esta zona y no en el código. Acto seguido en el menú superior vamos
Insertar > Formulario > Formulario:
Mini manual para crear formularios con PHP Servicio de Informática y Comunicaciones
5
Y nos resulta algo así:
Hemos creado el campo del formulario. Ahora lo que debemos hacer es insertar dentro de éste los campos que
queramos utilizar en nuestro formulario. Para ello situamos el cursor dentro del formulario (es decir, dentro de la zona
punteada) y volvemos a ir a Insertar > Formulario > y ahí seleccionamos el elemento que queramos introducir. En nuestro ejemplo vamos a desarrollar un formulario de contacto simple, para que se vea con claridad el proceso. Para
ello seleccionamos “cuadro de texto”.
Mini manual para crear formularios con PHP Servicio de Informática y Comunicaciones
6
En la vista de diseño obtendremos esto:
Ahora, con las flechas del teclado, nos vamos al punto justo antes del cuadro de texto que hemos insertado para
escribir ahí el texto con las instrucciones para las personas que tengan que rellenar el formulario. Nuestro campo
corresponderá con el apellido de la persona, con lo que escribiremos “Apellidos”:
Visualmente ya sabemos que ese campo de texto corresponde con los apellidos. No obstante necesitamos en este
momento asignar un valor interno a ese campo. Para señalar ese valor pulsamos sobre el campo de texto con el botón derecho del ratón. Nos aparece un menú contextual. En él escogemos “propiedades de campo de formulario”:
Al seleccionarlo nos abre una ventana con las opciones de nuestro campo de formulario. Es muy importante que NO UTILICEMOS TILDES, NI MAYÚSCULAS, NI –mucho menos- ESPACIOS EN BLANCO ya que podríamos causar que
nuestra pequeña aplicación no funcionara:
Mini manual para crear formularios con PHP Servicio de Informática y Comunicaciones
7
Aceptamos y ya habremos configurado el cuadro de texto de modo correcto.
Ahora insertamos todos los campos que queramos y los configuramos de modo similar al que hemos hecho, indicándole las propiedades que correspondan en cada caso.
Ahora fijamos nuestra atención en la vista del código. Buscamos dónde empieza la etiqueta del formulario (todo el
contenido del formulario está entre las etiquetas <form> y </form>). Localizamos “<form>” y dentro de las
propiedades de ésta observamos lo siguiente:
Dejamos tal cual la parte que dice «method="POST"» y en donde indica «action="--WEBBOT-SELF--">» lo cambiamos por «action="enviar.php"». Con esto conseguiremos que los datos que los usuarios introduzcan en el
formulario sean procesados por la página enviar.php que es la que se encarga de enviar todos los datos por correo
electrónico, tal como veremos más adelante. A su vez suprimimos la línea que está justo debajo y que dice: <!--webbot bot="SaveResults" U-File="_private/form_results.csv" S-Format="TEXT/CSV" S-Label-Fields="TRUE" -->.
Mini manual para crear formularios con PHP Servicio de Informática y Comunicaciones
8
Por tanto, una vez realizados estos cambios nuestro código queda así:
Una vez terminemos de modificar guardamos el archivo html con el que hemos estado trabajando con el nombre que queramos, evitando siempre mayúsculas, tildes y espacios en blanco:
Mini manual para crear formularios con PHP Servicio de Informática y Comunicaciones
9
PÁGINA 2: PÁGINA PHP QUE NOS ENVÍA EL CORREO ELECTRÓNICO CON LOS DATOS
Abrimos una nueva página tal como hicimos en «PÁGINA 1». Nos vamos a la vista de código. Una vez hayamos
pinchado en esa vista, nos vamos al menú “edición > seleccionar todo” y acto seguido volvemos a ir “edición > eliminar”:
Con esto dejamos absolutamente vacío el código html:
Mini manual para crear formularios con PHP Servicio de Informática y Comunicaciones
10
Y guardamos el documento con el nombre «enviar.php»:
Observará que, a partir de este momento, desaparecerá la opción de ver la vista de diseño. No se preocupe ya que en
esta página sólo escribiremos unas líneas código.
Escriba a partir de la línea 1 exactamente del mismo modo que aparece aquí:
Mini manual para crear formularios con PHP Servicio de Informática y Comunicaciones
11
Como usted ya ha visto, en la línea 3 del código, donde dice «SUEMAIL» cámbielo por su e-mail o el de la persona a
la que el formulario le será enviado; en la línea 4 donde dice «Consulta enviada desde SUWEB» cámbielo por el texto que desee; recuerde que ese texto es el que le aparecerá en el campo “Asunto” del mensaje de correo electrónico
que le llegará a su buzón por lo que sugerimos que escriba un texto mediante el que usted identifique fácilmente el correo recibido como formulario enviado desde su sitio web.
Una vez usted introduzca esos datos, el código quedaría tal que así:
En las líneas 3,4,5 y 6 aparece como primer elemento el carácter “ $ ”. Al poner delante de una palabra (o letra) ese símbolo (por ejemplo: $para) estamos creando una variable con un determinado valor. Así le indicamos que, en este
caso, $para tiene como valor “[email protected]”, $asunto tiene como valor “Consulta enviada desde
uhu.es/paz.padilla”. Entendemos, por tanto, que una variable es una estructura de datos que puede cambiar de contenido a lo largo de la ejecución del proceso.
Puede observar que $remitente tiene como valor otra variable, en concreto $correo. Si usted recuerda cuando hizo la
primera página del formulario, al campo de texto donde los usuarios escriben su dirección de correo electrónico se le
puso como valor, dentro de sus propiedades, “correo”. Al procesar la página enviar.php los datos que le llegan desde formulario.htm recoge la variable $correo que el usuario introdujo. Por lo tanto si le damos la instrucción de que la
variable $remitente = $correo siempre nos devolverá lo que previamente la persona que ha rellenado el formulario ha escrito.
Finalmente en la línea 6 aparece $mensaje = “. Como usted puede comprobar hay un gran espacio que va desde la
línea 7 hasta la 17, que cierra con una comilla y un punto y coma. Esto significa que el valor de la variable $mensaje
es todo lo que se escriba desde la línea 7 hasta la línea 16. Por tanto escribimos en ese espacio el resto de elementos que nos faltan; si en el campo de texto donde la persona escribe sus apellidos tiene como valor “apellidos”, la variable
que nos devuelve lo que ha escrito el usuario es $apellidos. Así quedarían las líneas que nos faltan:
Apellido del usuario: $apellidos
Nombre del usuario: $nombre Correo Electrónico del usuario: $correo
Comentario del usuario: $comentario
Mini manual para crear formularios con PHP Servicio de Informática y Comunicaciones
12
Dentro del código queda así la visualización:
Guardamos todos los cambios.
Como ha notado, las variables de nuestra página enviar.php tienen el nombre de los campos del formulario y como
valor lo que el usuario escribe en éste.
Mini manual para crear formularios con PHP Servicio de Informática y Comunicaciones
13
PÁGINA 3: PÁGINA QUE NOS CONFIRMA EL ENVÍO
Ahora creamos un nuevo documento en blanco tal como vimos en la página 1. El documento que creamos se llamará
enviado.htm y tendrá como función confirmar el envío del formulario. Cuando la página enviar.php recoge los datos del formulario los envía a la dirección de correo que ha introducido e inmediatamente después de hacerlo carga la
página de confirmación que vamos a crear.
Insertamos el texto predefinido que saldrá, por ejemplo:
“Muchas gracias por realizar su consulta. En breve le responderemos en la dirección que nos ha indicado en el formulario.”
Y le damos a “guardar”.
Ya tenemos nuestro formulario en php correctamente diseñado. Ahora súbalo al servidor y realice las pruebas que necesite enviándose a sí mismo algunos formularios de contacto. Una vez que verifique que todo funciona
correctamente ya lo puede colgar definitivamente para que sea utilizado.
Mini manual para crear formularios con PHP Servicio de Informática y Comunicaciones
14
ACLARACIONES
- Para poder enviar un formulario necesita estos tres archivos sobre los que hemos estado hablando. Es necesario que
éstos se encuentren, dentro de su sitio web, en la misma carpeta ya que podrían dar errores si se sitúan incorrectamente en otras ubicaciones.
- Si usted desea tener más de un formulario deberá crear tantos archivos como formularios: si tiene 4 formularios
deberá tener 4 páginas formulario, 4 páginas de proceso de envío (enviar.php) y 4 páginas de confirmación, todas
ellas con nombres distintos. Recuerde que cada página formulario debe enviarse a la página de envío que le corresponda para que lea las variables necesarias y las procese correctamente al correo. Si usted no desea
personalizar las páginas de confirmación y dejar siempre la misma puede hacerlo, de modo que tenga, por ejemplo, 4 páginas formulario, 4 páginas de proceso de envío y 1 página de confirmación.