65 – VALIDACIÓN DE LOS CAMPOS PARA INSERTAR DATOS EN LA TABLA INFORMACIONES con BD(👨💻PHP y MYSQL💻)

Duración: 15 min
Módulo: ⚙️ Configuraciones del Sistema y Control de Versiones Lección 3 de 18

Descripción

Título: 65 – VALIDACIÓN DE LOS CAMPOS PARA INSERTAR DATOS EN LA TABLA INFORMACIONES con BD (👨💻PHP y MYSQL 💻)

En esta lección, el instructor se enfoca en el desarrollo del frontend y backend del formulario de Configuraciones, asegurando que todos los campos requeridos (como el nombre del parqueo, la dirección y el país) estén llenos antes de que el usuario pueda registrar la información en la base de datos.

1. Validación en Frontend (Visual) 🖥️

  • Marcaje Obligatorio: Dado que el formulario se maneja mediante AJAX y no con el submit tradicional de HTML, el atributo required no es suficiente [01:12].
  • Indicador Visual: Se utiliza un span con un asterisco rojo (*) junto a la etiqueta de cada campo [01:28] para indicar visualmente al operador que el campo es de llenado obligatorio. Se determina que todos los campos del formulario son requeridos [02:54].

2. Validación en Backend (Lógica con jQuery/AJAX) ⚙️

  • Identificación de Variables: Se asigna un ID único a cada campo (input) del formulario (ej., id="nombre_parqueo") [03:26]. Luego, se utiliza jQuery para capturar y almacenar el valor de cada campo en una variable JavaScript [04:38].
  • Disparador del Script: Se identifica el botón de registro (#btn_registrar_informacion) para que, al ser presionado, ejecute el script de validación [06:00].
  • Estructura de if Anidados: Se implementa una serie de estructuras if/else if anidadas para verificar el estado de cada variable en un orden específico (del primer campo al último) [07:13].
    • Condición: Si el valor de un campo es igual a vacío (== ""), se ejecuta una acción de alerta.
    • Alerta y Foco: Si un campo está vacío, el script hace dos cosas:
      1. Muestra un mensaje de alerta (alert()) al usuario indicando el campo faltante (ej., "Debes llenar el campo nombre del parqueo") [07:40].
      2. Utiliza el método .focus() para posicionar automáticamente el cursor en el campo que requiere llenado [07:55].
  • Bloque else Final: Solo cuando todas las validaciones previas se cumplen (es decir, todos los campos tienen un valor), el código entra en el bloque else [12:22]. Este bloque es la señal de que la información está lista y puede ser enviada al Controlador de PHP para su inserción en la base de datos.

Al finalizar la lección, el formulario está protegido con validaciones del lado del cliente, garantizando que todos los datos necesarios para el encabezado del ticket sean ingresados de forma correcta y completa. La próxima lección se centrará en crear el controlador de PHP para el registro final.