Validar formulario con JavaScript - Form validation

แชร์
ฝัง
  • เผยแพร่เมื่อ 10 ก.พ. 2025
  • REDES SOCIALES:
    ► codigomentor.com/
    ►Síguenos en FACEBOOK: / codigomentor
    Cursos de programación
    Tutoriales de programación
    CURSO DE HTML: shorturl.at/grGKX
    CURSO DE CSS: shorturl.at/flLQ8
    CURSO DE JAVASCRIPT en 30minutos: shorturl.at/ACMR4
    CURSO DE COMPLETO DE JAVASCRIPT: shorturl.at/qryEF
    CURSO DE REACT en 30 minutos: shorturl.at/bnrV3
    CURSO DE REACT: shorturl.at/tGIXZ
    CURSO DE ANGULAR: shorturl.at/dnpvF
    CURSO DE NGRX ANGULAR: shorturl.at/kNST6
    CURSO DE NODEJS: shorturl.at/tRY68
    CURSO DE PHP: shorturl.at/beijZ
    CURSO DE PYTHON: shorturl.at/pquZ6
    CURSO DE LARAVEL: shorturl.at/gkGS6
    Systema de Login con PHP y envios de correo electrónico: shorturl.at/awMPZ
    CONTECTARSE A Dase de DATOS con JDBC y JAVA: shorturl.at/bPXZ2
    CURSO DE JSON: shorturl.at/cRX25
    CURSO DE JAVA: shorturl.at/HKV36
    CURSO DE JQUERY: shorturl.at/gyXY0

ความคิดเห็น • 85

  • @victoriamendez9061
    @victoriamendez9061 4 หลายเดือนก่อน +1

    hola!, gracias por el video, por fin un tutorial que no se da tantas vueltas, gracias

  • @dan75d99
    @dan75d99 2 ปีที่แล้ว +3

    De verdad muchas gracias, entendi todo sobre la validacion.

  • @Marfelcomputer
    @Marfelcomputer 4 ปีที่แล้ว +6

    PARA LOS QUE VEAN ESTO: suplante el preventdefault() que los youtuber le ponen al submit para que no haga nada por el windows.local. En mi caso llevaba un parametro. "e.preventdefault();" asique suplante por "e.windows.local();"

  • @itzgabrieh4371
    @itzgabrieh4371 2 ปีที่แล้ว +1

    me salvaste en la recuperación ma boy

  • @ricardoleonsierraposada5671
    @ricardoleonsierraposada5671 2 ปีที่แล้ว +1

    Yo le agregue esta lineas para que ejecutara el submit si no habia error en la validación
    if(mensajesError.length > 0){
    error.innerHTML = mensajesError.join(', ');
    return false;
    }
    Muchas gracias por su video, fue de gran ayuda para mi

    • @CodigoMentorTutoriales
      @CodigoMentorTutoriales  2 ปีที่แล้ว +1

      De nada Ricardo :). Cualquier duda no olvides en suscribirte. Saludos!

  • @thebroki6684
    @thebroki6684 2 ปีที่แล้ว +1

    EXCELENTE VIDEO MASTER!!! MUCHAS GRACIAS!!!!!!!

  • @elnenedeldance
    @elnenedeldance 4 ปีที่แล้ว

    escribo el codigo tal cual y no me salta la alerta

  • @onigoroshi7
    @onigoroshi7 4 ปีที่แล้ว +2

    Muchas gracias, me sirvio perfecto el primer ejemplo el segundo no logre hacerlo correr

  • @MrRampengu
    @MrRampengu 3 ปีที่แล้ว +7

    Muy bueno, pero faltó ver expresiones regulares para evitar que no pongan numeros o caracteres especiales en el nombre...

  • @nicocaceresh6470
    @nicocaceresh6470 11 หลายเดือนก่อน

    buenas noches como tendria que hacer si quisiera que una vez enviado el formulario se borren los datos osea se "limpie" para que no quede guardado

  • @mauricemorty4687
    @mauricemorty4687 2 ปีที่แล้ว

    gracias por pronunciar bien las palabras en inglés

  • @FranciscoJavierMurilloVasquez
    @FranciscoJavierMurilloVasquez ปีที่แล้ว +1

    Hola excelente!!

  • @shagumagal5797
    @shagumagal5797 3 ปีที่แล้ว

    gracias me ayudaste mucho

  • @adriancordova1618
    @adriancordova1618 4 ปีที่แล้ว +7

    vuelvo a escribir por enésima vez lo que ya he escrito en muchos otros videos : cómo enviar el formulario si los datos son correctos ?? nadie explica eso ... okay la validación muy padre pero el método preventDefault () cancela el evento y no hay forma de reanudarlo ......... ni con location . href ni con el método submit() ni nada ... ya no se envía el formulario ... cómo entonces hago yo para enviar el formulario ???

    • @emelcastano
      @emelcastano 4 ปีที่แล้ว +1

      windows.local

    • @Marfelcomputer
      @Marfelcomputer 4 ปีที่แล้ว +3

      @@emelcastano Esa pequeña linea de codigo que pusiste me salvo la vida. Muchas gracias, suplante el preventdefault() que los youtuber le ponen al submit para que no haga nada por el windows.local. En mi caso llevaba un parametro. "e.preventdefault();" asique suplante por "e.windows.local();"

    • @emelcastano
      @emelcastano 4 ปีที่แล้ว +1

      @@Marfelcomputer que bueno que te sirvio

    • @danielsubuyuj5125
      @danielsubuyuj5125 3 ปีที่แล้ว

      @@emelcastano Que tal..,Gracias por tu aporte! me podrías explicar como implementarlo y resolver el problema de enviar los datos correctos!? saludos!!

  • @KarolinaIbarra10
    @KarolinaIbarra10 3 ปีที่แล้ว +2

    Gracias :)

    • @CodigoMentorTutoriales
      @CodigoMentorTutoriales  3 ปีที่แล้ว

      De nada Martha, cualquier duda no olvides en suscribirte. Saludos!

  • @IvanRodriguez-xk3zz
    @IvanRodriguez-xk3zz ปีที่แล้ว +1

    Hola , esto me sirve para una pagina también o solo para app?

  • @CodigoMentorTutoriales
    @CodigoMentorTutoriales  5 ปีที่แล้ว +9

    Validar formulario con JavaScript - Form validación

  • @sofiaalonso4184
    @sofiaalonso4184 2 ปีที่แล้ว

    En vez de get element por id lo puedo obtener por class?

  • @camilodinardo6365
    @camilodinardo6365 3 ปีที่แล้ว

    rey como lo pongo debajo del div? no me sirve tenerlo debajo dle boton y que esten todos juntos, quiero que esten separados x cada input

  • @fabriciogomez8057
    @fabriciogomez8057 3 ปีที่แล้ว

    pero al tener un return false, eso no evitara que el formulario se envie por mas que los datos esten correctamente ingresados?

  • @vladimirmontesbetancur5833
    @vladimirmontesbetancur5833 4 ปีที่แล้ว +2

    Muchas gracias, tengo una pregunta, si quiero hacer que este formulario valide, y si cumple la validación, enviar el registro a la base de datos, sirve la linea de evt.preventDefault(); ? Para verificar eso? Muchas gracias

    • @adriancordova1618
      @adriancordova1618 4 ปีที่แล้ว +1

      Sigo batallando con lo mismo y no he encontrado un video que lo resuelva ....

    • @vladimirmontesbetancur5833
      @vladimirmontesbetancur5833 4 ปีที่แล้ว +1

      @@adriancordova1618 Yo encontre uno muy bueno, th-cam.com/video/nLrL9Ip3tWI/w-d-xo.html, obviamente esta muy basico, le falta validaciones pero las hice, y ya me hace registros en la base de datos y todo, te lo recomiendo.

  • @Henry_Nunez
    @Henry_Nunez ปีที่แล้ว +1

    Excelente 👍👍

  • @santiagoramirezguerrero4421
    @santiagoramirezguerrero4421 3 ปีที่แล้ว

    Tengo un problema al utilizar el metodo post no me funciona pero la validacion si, es decir comento el script y funciona el metodo post y me redirige a la pagina pero si pongo el script me valida pero no me redirige...

  • @JMarioBMX
    @JMarioBMX 4 ปีที่แล้ว +5

    Estuvo muy bueno el video, pero tengo una pregunta, como hago para validar los input de tipo DATE, RADIO y CHECKBOX?

  • @techno-nic9017
    @techno-nic9017 3 ปีที่แล้ว

    Bien explicado, pero al final, cuando ya tengo el código igual que tú, cuando ya lleno todos los campos que estoy validando al dar clic en mi botón no manda la información, ¿Qué puede ser?

  • @GMF2015
    @GMF2015 3 ปีที่แล้ว

    Muchas gracias por tus vídeos... estoy tratando de aprender a usar Tampermonkey o alguno similar... pero no consigo un tutorial en español.... alguna sugerencia?... gracias

  • @gabrielcamargo4250
    @gabrielcamargo4250 2 ปีที่แล้ว

    Cómo se validarla para que no pongan por ejemplo (espacio) nombreaqui

  • @anretro4138
    @anretro4138 ปีที่แล้ว

    Como puedo sumarle un radio button?

  • @jeffreymonjacastro609
    @jeffreymonjacastro609 4 ปีที่แล้ว +2

    Graciasss

  • @camilozunigatamayo4232
    @camilozunigatamayo4232 4 ปีที่แล้ว +1

    Tengo una duda gente,
    ¿Se podría validar un formulario cualquiera con la etiqueta required="" dentro de un input?

    • @CodigoMentorTutoriales
      @CodigoMentorTutoriales  4 ปีที่แล้ว

      Hola Camilo, la respuesta es si, sin embargo recuerda que en navegadores antiguos pueda que no funcione. Saludos!

  • @brianpelli7867
    @brianpelli7867 4 ปีที่แล้ว +1

    Una pregunta no se me valido, es decir cuando compio todo tal cual pero no anda, pero me passa que las palabras style, value estan en blanco porque sera

  • @micaelabenitez525
    @micaelabenitez525 3 ปีที่แล้ว

    hola. y como guardo los datos enviados ??

  • @leonardocardosorodriguez6849
    @leonardocardosorodriguez6849 4 ปีที่แล้ว

    buenas noches como puedo validar si el input de tipo file tiene algún valor es decir si se adjunto algo antes de enviar como puedo saber eso con js

    • @lajoba01
      @lajoba01 4 ปีที่แล้ว

      Creo que seria con el ir,
      Por ejemplo:
      Var file = document.getElementById('file') //acá pones el ID de tu input file
      if(file.value === ""){ alert("input file está vacío")}
      Else( acá le decís que querés que haga si el input file no está vacío)

  • @chanofux5151
    @chanofux5151 4 ปีที่แล้ว

    Yo quiero terminar una página y me aparece identificador inesperado cada vez q pongo console después de haber tocado F12

  • @jalmendoza2002
    @jalmendoza2002 4 ปีที่แล้ว

    Hola buenas noches, disculpa, ya hice todo el codigo y lo copié tal cual, pero no me aparece el alert de "Ingresa tu nombre, Ingresa tu password".
    ¿Que puedo hacer?

    • @CodigoMentorTutoriales
      @CodigoMentorTutoriales  4 ปีที่แล้ว +2

      Hola Jatziri, asegurate de que el formulario no se este enviando por defecto. Saludos :)

  • @hefestionaga
    @hefestionaga 4 ปีที่แล้ว

    ok, pero ahora porque no me funcionan las funciones que añado al .js?

  • @carlosarielmartinrojas1169
    @carlosarielmartinrojas1169 3 ปีที่แล้ว

    y como podria poner el mensaje de error debajo del input o el label??

    • @maurocob
      @maurocob 3 ปีที่แล้ว

      No se puede poner en el input porque lo tomaria como la etiqueta en el html. Por eso se pone en el .push ('mensaje de error')Ya que ahi indica segun la validacion el error o el mensaje que vos le quieras poner.

  • @jhonjairobermudezpabon5913
    @jhonjairobermudezpabon5913 4 ปีที่แล้ว +3

    Y el formulario no carga entonces?

    • @jimmyroserovallejo
      @jimmyroserovallejo 4 ปีที่แล้ว

      Como hacer para que si son iguales el formulario cargue--- ?

    • @lajoba01
      @lajoba01 4 ปีที่แล้ว

      @@jimmyroserovallejo iguales a qué?

  • @alexiszaccaria7936
    @alexiszaccaria7936 4 ปีที่แล้ว

    Buen video. Pregunta, en caso de que se ingrese password y nombre correctamente se envia de forma normal o se debe hacer otra cosa mas?

    • @juansalazar7037
      @juansalazar7037 3 ปีที่แล้ว

      Te tocaría seguir haciendo la validación por medio de Ajax

  • @jimmyroserovallejo
    @jimmyroserovallejo 4 ปีที่แล้ว

    la primera forma me funciono la segunda no, como hago para Como hacer para que si son iguales el formulario se envié (compare las dos contraseñas pero al ser iguales solo sale el mensaje de"son iguales" pero no me envía el formulario como lo haría ? ?

    • @MrCharlypesc
      @MrCharlypesc 4 ปีที่แล้ว

      el return false debe estar dentro del if

  • @rawyeid4168
    @rawyeid4168 4 ปีที่แล้ว

    me sigue yendo al action, no se como hacer para que al enviarse no vaya al action si da error.

    • @CodigoMentorTutoriales
      @CodigoMentorTutoriales  4 ปีที่แล้ว

      Hola amigo, no olvides prevenir que el formulario se envie por defecto. Utiliza el return false o sino tel evt.preventDefault(). Todo esta en el video :). Saludos!

    • @spiritualway3
      @spiritualway3 4 ปีที่แล้ว

      @@CodigoMentorTutoriales El tema es que despues cuando si esta todo valido no se termina enviando porque le puse que no se envie nunca con e.preventDefault() o el return false o no ? Yo quiero que al final si todo va bien que si se termine enviando

  • @DiegoGutierrez-gu5ui
    @DiegoGutierrez-gu5ui 4 ปีที่แล้ว +1

    Aun me falta mucho, la primera validación se me hizo algo más fácil pero aun sigo sin entender algunas cosas.

    • @TzarXoPo
      @TzarXoPo 4 ปีที่แล้ว +1

      es normal, este men no explica nada, él solo va haciendo y ya.

  • @ngineerniko9450
    @ngineerniko9450 4 ปีที่แล้ว

    No me funciona, no sé por qué, estoy revisando los espacios como | id = ' '>

    • @ngineerniko9450
      @ngineerniko9450 4 ปีที่แล้ว +1

      Solucionado, eran el | for = 'clave ' | que no coincidia con el | id = 'password'

  • @emelcastano
    @emelcastano 4 ปีที่แล้ว

    hola no me da halguien me puede enviar el codigo

    • @davidmaysima8740
      @davidmaysima8740 2 ปีที่แล้ว

      formulario 3

      label {
      display: block;
      float: left;
      width: 70px;
      margin: 0px 10px;
      }
      .nombre {
      position: relative;
      left: 20px;
      }



      Nombre



      Contraseña






      var nombre = document.getElementById("nombre");
      var password = document.getElementById("password");
      var error = document.getElementById("error");
      error.style.color = "red";
      function enviarFormulario() {
      console.log("enviando formulario");
      var mensajesError = [];
      if (nombre.value === null || nombre.value === "") {
      mensajesError.push("ingresa tu nombre");
      }
      if (password.value === null || password.value === "") {
      mensajesError.push("ingresa tu password");
      }
      error.innerHTML = mensajesError.join(", ");
      return false;
      }

      ESTE ES EL CODIGO DEL VIDEO Y SI FUNCIONA

  • @12.galvanmezavaleria61
    @12.galvanmezavaleria61 4 ปีที่แล้ว +1

    me dice que no puede leer
    error.style.color = 'red';

    • @CodigoMentorTutoriales
      @CodigoMentorTutoriales  4 ปีที่แล้ว +1

      Hola valeria, asegurate que tu variable error sea una referencia correcta al elemento del DOM. Saludos :)

  • @santifessia1993
    @santifessia1993 5 ปีที่แล้ว

    por que me dice que : TypeError: document.getElementsById is not a function
    at Form_val.js:3
    Form_val lo llame a mi carpeta js.

  • @chanofux5151
    @chanofux5151 4 ปีที่แล้ว +2

    A mí no me estaría funcionado por más q pongo todo lo del video