Vista Editar Persona - eliizquierdo/material_programacion_avanzada2026 GitHub Wiki

📦 Proyecto: mini-crud1 (Fase 2) — ⬇️ Descargar ZIP · ☁️ Abrir en Codespace

Vista Editar Persona: persona-editar.jsp

Esta página es la que se muestra cuando hacemos clic en el botón "Editar" desde persona-lista.jsp.

Nos permite llenar un formulario con dos campos: código y nombre, y luego enviar esos datos al sistema.

Diferencias con persona-form.jsp

Es casi igual al formulario persona-form.jsp excepto en los siguientes detalles:

1. Cambia el hidden action:

<input type="hidden" name="action" value="editar">

2. Código: viene precargado y readonly:

<input type="number" name="codigo" value="${requestScope.persona.codigo}" readonly required>

3. Nombre: viene precargado:

<input type="text" name="nombre" value="${requestScope.persona.nombre}" required>

4. Botón cambia el texto:

<button class="btn" type="submit">Actualizar</button>

Código completo del JSP:

<%@ page contentType="text/html; charset=UTF-8" %>
<!DOCTYPE html>
<html lang="es">
  <head>
    <meta charset="UTF-8" />
    <title>Editar Persona</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/styles.css" />
  </head>
  <body>
    <div class="form-container">
      <h1>Editar Persona</h1>

      <!-- POST al Servlet con action=editar -->
      <form action="${pageContext.request.contextPath}/persona" method="post">
        <input type="hidden" name="action" value="editar" />

        <label>Código</label>
        <input type="number" name="codigo" value="${requestScope.persona.codigo}" readonly required />

        <label>Nombre</label>
        <input type="text" name="nombre" value="${requestScope.persona.nombre}" required />

        <button class="btn" type="submit">Actualizar</button>
        <a class="btn btn-secondary" href="${pageContext.request.contextPath}/persona">Volver</a>
      </form>
    </div>
  </body>
</html>

¿Cómo funciona?

  1. El controlador inyecta los datos: Cuando el usuario hace clic en "Editar" desde la lista, el controlador ejecuta cargarEditar() que busca la persona y la inyecta como atributo persona

  2. Los campos se precargan:

    • El código viene con value="${requestScope.persona.codigo}" y readonly para evitar modificaciones. EL llama automáticamente a persona.getCodigo() por nosotros.
    • El nombre viene precargado con value="${requestScope.persona.nombre}", que llama a persona.getNombre().

  3. El POST va con action=editar: El formulario envía action=editar para que el controlador sepa que debe actualizar, no agregar

  4. PRG se aplica: Después de la actualización, el controlador redirige al listado

Flujo completo:

Lista → Botón "Editar" → GET cargarEditar → persona-editar.jsp (precargado)
         ↓
Formulario → POST editar → Controlador actualiza → Redirect → Lista actualizada

Continuemos en VISTA- Listar Personas

📋 Palabras clave

persona-editar.jsp · formulario editar · precarga de datos · readonly · action=editar · Expression Language · EL · requestScope · PRG · Vista MVC

🧠 Autoevaluación — Mini-CRUD con MVC

← PersonaControladorServlet2 · 🏠 Inicio · VISTA: Listar Personas (Fase 2) →

Licencia Creative Commons

Prof. Elizabeth Izquierdo con asistencia de Gemini y Claude

⚠️ **GitHub.com Fallback** ⚠️