13. Crea un formulario de contacto con PHP

This course will become read-only in the near future. Tell us at community.p2pu.org if that is a problem.

Task Navigation 

Muestra los mensajes de error en el formulario


En esta tarea vamos a ver como podemos utilizar la información de error que manda receptor.php (errorNombre, errorEmail, errorMensaje) para mostrar mensajes de error en el formulario. Esto se visualiza mejor con un ejemplo:

Vamos a utilizar la información del nombre:

<?php
/*Este código sirve para asegurarnos de que no vamos a utilizar las variables si no tienen valor (como cuando abres la página directamente). Si utilizamos las variables $_GET["variable"] directamente PHP enviará un Notice cuando abras la página.
*/

    if (isset($_GET["nombre"]) == true) {
        $nombre = $_GET["nombre"];
    }
    else {
        $nombre = "";
    }
    
    if (isset($_GET["errorNombre"]) == true) {
        $errorNombre = $_GET["errorNombre"];
    }
    else {
        $errorNombre = 0;
    }
?>

<html>
<body>
    <form action = "receptor.php" method = "post">
        <?php
            if ($errorNombre == 1) {
                echo 'Nombre: <input type = "text" name = "varNombre" />    <span style = "color:red;"> El nombre no puede quedar en blanco</span> <br/>';
            }
            else {
                echo 'Nombre: <input type = "text" name = "varNombre" value ='. $nombre . '/> <br/>';
            }
        ?>
             
        <input type="submit" value="Enviar" />
    </form>
</body>
</html>


Analicemos que cambio en el formulario:

  • Utilizamos la función isset() para verificar si una variable tiene valor
  • Incluimos código PHP dentro del <form>
  • Validamos si hubo error ($_GET[errorNombre] == 1). Si hay error entonces desplegamos un campo de captura de texto vacío y al lado un mensaje de error en color rojo.
  • Si no hay error, desplegamos un campo de captura de texto que tiene como valor el nombre que se envío (value = $_GET[nombre] ).
  • El campo de captura del nombre ya no se escribe como HTML estático, sino que lo desplegamos utilizando un echo. Cabe destacar que el echo ahora lo estamos utilizando con comilla simple ( ' ), esto es porque tenemos que incluir comilla doble ( " ) en el texto.


Para completar esta tarea:

  1. Modifica formulario.php y añádele los mensajes de error al nombre, email y mensaje.
  2. Recuerda que el tag <textarea> no tiene atributo value, su valor se agrega en medio de los tags así: <textarea>valor</textarea>
  3. Cuando termines, además de tener un formulario bien cool, el código de tu formulario debe ser como este.
    • Tu formulario se debe comportar así


Te recomendamos:

Task Discussion