Lección: 31 Como INSTALAR mensajes con SWEETALERT2 en el SISTEMA VETERINARIO(PHP y MySql)FullStack

31 Como INSTALAR mensajes con SWEETALERT2 en el SISTEMA VETERINARIO(PHP y MySql)FullStack

Duración: 15 min

Módulo: 👤 CRUD Completo de Usuarios (Gestión de Datos) Lección 6 de 12

Descripción

🎬 Lección 31: Integración de SweetAlert2 para Mensajes Dinámicos ✨

Este capítulo reemplaza el sistema básico de alertas (Bootstrap y JavaScript alert()) con SweetAlert2, ofreciendo notificaciones más atractivas, dinámicas y personalizables para el usuario.

1. Instalación y Configuración Inicial ⚙️

Librería: El instructor procede a instalar SweetAlert2 copiando los enlaces CDN de la librería. [00:08]
Dependencia: Se identifica que SweetAlert2 requiere jQuery, por lo que se reordena la carga de scripts para asegurar que jQuery se cargue primero, seguido por la librería de SweetAlert2. [00:48]
Ubicación: Ambos scripts se integran en el layout principal del proyecto.

2. Implementación de Mensajes de Alerta 🎨

Reemplazo del Código: El código HTML y JavaScript que mostraba la alerta simple en la vista (create.php) se reemplaza con la sintaxis de SweetAlert2. [01:20]
Contenido Dinámico: Se configura SweetAlert2 para que el mensaje de la sesión ($_SESSION['mensaje']) se imprima dinámicamente en el texto de la alerta. [03:05]
Iconos y Tipos de Alerta: Se crea una segunda variable de sesión ($_SESSION['icono']) en el controlador para especificar el tipo de alerta (ej. error para un registro fallido, o success para un registro exitoso). Esto permite a SweetAlert2 mostrar el icono y color adecuados. [06:46]
Temporización: Se añade la opción de timer (en milisegundos) para configurar cuánto tiempo permanece visible la alerta antes de desaparecer automáticamente (por ejemplo, 5000ms = 5 segundos). [03:37], [05:35]

3. Creación del Sistema Global de Mensajes 🌍

Refactorización: Para evitar la repetición de código, la lógica completa que verifica si existe una sesión de mensaje (isset()), la muestra con SweetAlert2 y la destruye (unset()) es extraída del archivo de la vista y se coloca en un archivo PHP independiente (mensaje.php). [09:45]
Reutilización: Este archivo mensaje.php se incluye en el layout principal de administración, convirtiéndolo en un sistema de mensajes global que puede ser utilizado por cualquier controlador o vista (registro, listado, etc.) sin necesidad de replicar el código. [10:47]

Este nuevo sistema es aplicado a todas las validaciones previas (contraseñas no iguales, correo electrónico ya registrado y registro exitoso), ofreciendo una respuesta visualmente superior al usuario.

Hilari Web