Formularios PHP - Ejemplo Práctico

Aprende cómo funcionan los formularios web con PHP: desde el envío hasta el procesamiento


Descargar Formulario

¿Cómo Funciona un Formulario PHP?

1. El Usuario Llena el Formulario

El usuario ingresa datos en los campos del formulario HTML:

  • Campos de texto para nombre, apellido, etc.
  • Select para opciones predefinidas
  • Textarea para observaciones largas

2. Envío al Servidor

Al hacer clic en "Enviar", los datos viajan al servidor:

<form action="accion.php" method="post">
    <!-- Campos del formulario -->
</form>

action: Indica qué archivo procesará los datos

method="post": Los datos se envían de forma segura

3. PHP Procesa los Datos

El archivo accion.php recibe y procesa la información:

<?php
// Recoger datos del formulario
$nombre = $_POST['nombre'] ?? '';
$apellido = $_POST['apellido'] ?? '';

// Procesar y guardar datos
file_put_contents('log.txt', $registro, FILE_APPEND);
?>

4. Mostrar Resultado

Finalmente, se muestra una página de confirmación al usuario con los datos procesados.

📝 Ejemplo Funcional - Pruébalo!

Este es un formulario real que puedes probar. Llena los datos y verás cómo se procesan.

Formulario de Contacto

🔍 Código del Formulario (formulario.php)

Así es como se estructura el formulario HTML:

Estructura HTML del Formulario

<!DOCTYPE html>
<html>
<head>
    <title>Formulario PHP</title>
</head>
<body>
    <form action="accion.php" method="post">
        <label>Nombre: <input type="text" name="nombre"/></label>
        <label>Apellido: <input type="text" name="apellido"/></label>
        <label>Correo: <input type="text" name="correo"/></label>
        <label>Teléfono: <input type="text" name="telefono"/></label>
        <label>Observaciones: <textarea name="observaciones"></textarea></label>
        <label>Provincia:
            <select name="provincia">
                <option value="provincia1">Toledo</option>
                <option value="provincia2">Guadalajara</option>
                <option value="provincia3">Ciudad Real</option>
                <option value="provincia4">Cuenca</option>
                <option value="provincia5">Albacete</option>
            </select>
        </label>
        <input type="submit" value="Enviar"/>
    </form>
</body>
</html>

Puntos Clave del Formulario:

  • action="accion.php": Los datos se envían a este archivo
  • method="post": Método seguro de envío
  • name="nombre": Identifica cada campo en PHP
  • required: Hace el campo obligatorio (HTML5)

⚙️ Código de Procesamiento (accion.php)

Así es como PHP procesa los datos recibidos:

Archivo accion.php - Procesamiento de Datos

<?php
// Verificar que se envió el formulario por POST
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    
    // Recoger datos del formulario con valores por defecto
    $nombre = $_POST['nombre'] ?? '';
    $apellido = $_POST['apellido'] ?? '';
    $correo = $_POST['correo'] ?? '';
    $telefono = $_POST['telefono'] ?? '';
    $provincia = $_POST['provincia'] ?? '';
    $observaciones = $_POST['observaciones'] ?? '';

    // Mapear códigos de provincia a nombres legibles
    $provincias = [
        'provincia1' => 'Toledo',
        'provincia2' => 'Guadalajara',
        'provincia3' => 'Ciudad Real',
        'provincia4' => 'Cuenca',
        'provincia5' => 'Albacete'
    ];

    // Obtener fecha y hora actual
    $fecha = date('Y-m-d H:i:s');

    // Convertir código de provincia a nombre legible
    $provinciaLectura = $provincias[$provincia] ?? 'No seleccionada';

    // Crear línea de registro para el archivo
    $registro = "[$fecha] Nombre: $nombre $apellido | ";
    $registro .= "Correo: $correo | Teléfono: $telefono | ";
    $registro .= "Provincia: $provinciaLectura | Observaciones: $observaciones" . PHP_EOL;

    // Guardar en archivo de log (se crea automáticamente si no existe)
    file_put_contents('log.txt', $registro, FILE_APPEND);
}
?>

<!DOCTYPE html>
<html>
<head>
    <title>Confirmación de Envío</title>
    <style>
        /* Estilos para la página de confirmación */
        body {
            font-family: Arial, sans-serif;
            background-color: #f5f5f5;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
        }
        
        .tarjeta {
            background-color: #000;
            color: #fff;
            width: 400px;
            padding: 30px;
            border-radius: 12px;
            box-shadow: 0 8px 20px rgba(0,0,0,0.3);
        }
    </style>
</head>
<body>
    <div class="tarjeta">
        <h1>Información del Cliente</h1>
        <p><span class="label">Nombre:</span> 
           <?php echo htmlspecialchars($nombre . ' ' . $apellido); ?></p>
        <p><span class="label">Correo:</span> 
           <?php echo htmlspecialchars($correo); ?></p>
        <p><span class="label">Teléfono:</span> 
           <?php echo htmlspecialchars($telefono); ?></p>
        <p><span class="label">Provincia:</span> 
           <?php echo htmlspecialchars($provinciaLectura); ?></p>
        <div class="observaciones">
            <span class="label">Observaciones:</span><br/>
            <?php echo nl2br(htmlspecialchars($observaciones)); ?>
        </div>
    </div>
</body>
</html>

Funciones PHP Importantes:

  • $_POST['nombre']: Accede a datos del formulario
  • htmlspecialchars(): Previene ataques XSS
  • nl2br(): Convierte saltos de línea en <br>
  • file_put_contents(): Guarda datos en archivo
  • date(): Obtiene fecha y hora actual

📊 Flujo Completo de Datos

Paso a Paso

  1. Usuario llena formulario en formulario.php
  2. Datos se envían via método POST a accion.php
  3. PHP procesa datos con $_POST
  4. Se guarda registro en archivo log.txt
  5. Se muestra confirmación al usuario

Archivos Generados

  • formulario.php: Página con el formulario
  • accion.php: Procesa y muestra resultados
  • log.txt: Archivo con todos los registros (se crea automáticamente)

🎯 Resultado Esperado

Después de enviar el formulario, verás una tarjeta negra con tus datos y se creará/actualizará el archivo log.txt con una línea como esta:

[2024-01-15 14:30:25] Nombre: María García | Correo: maria@ejemplo.com | Teléfono: +34 600 123 456 | Provincia: Toledo | Observaciones: Me gusta mucho esta página educativa

🎓 Para Estudiantes - Conceptos a Aprender

Métodos HTTP

POST vs GET:

  • POST: Datos van ocultos, más seguros, sin límite de tamaño
  • GET: Datos visibles en URL, menos seguros, límite de caracteres

Seguridad en Formularios

  • htmlspecialchars(): Escapa caracteres HTML
  • Validación: Siempre validar en servidor
  • Campos required: Validación básica en frontend

Manejo de Archivos

  • file_put_contents(): Escribe en archivos
  • FILE_APPEND: Añade contenido sin borrar lo existente
  • PHP_EOL: Salto de línea compatible con cualquier SO