Para los que no les funcione la validación del correo no olviden escapar también los guiones al final, - Correo: ^[a-z0-9]+(\.[_a-z0-9]+)*@[a-z0-9\-]+(\.[a-z0-9\-]+)*(\.[a-z]{2,15})$ de esta manera ya funcionara de manera correcta ya que en las clases de caracteres (dentro de corchetes []) en una expresión regular, los guiones se utilizan para definir rangos de caracteres. Para evitar confusiones, los guiones dentro de una clase de caracteres deben escaparse con una barra invertida \.
Todavia no puedo creer que exista una persona como jon que dedique todo el tiempo que dedica para enseñarnos todas las tecnologías en sus cursos y encima si le mandas una pregunta te responde... Una persona de otro planeta... Sos un genio jon!!!!
Muy buen contenido Jon, muchas gracias por compartirlo. El único detalle que quiero mencionar, es que si utilizas el atributo "title" para un mensaje de validación (como "email incorrecto"), también se muestra al pasar el mouse sobre el elemento (aún cuando esté en blanco o tenga un valor válido). Gracias por esta serie de vídeos, saludos!!
.contact-form [required]:invalid:not(:focus):not(:placeholder-shown){ border: thick solid var(--form-error-color); } solo mostraria un recuadro rojo al detectar que el placeholder esta vacio y ya no tiene focus el input
que genial el atributo pattern, no lo conocía, es muy útil validar así con las expresiones regulares. Genial todo lo que se puede hacer con formularios y eso que es la 1ra parte
Saludos Jon. Saludos a los compañeros. me reporto por acá nuevamente para ponerme al día con el curso. Antes de ver el video ya tenia mi maquetado del formulario. Pero el contenido del vídeo no tiene desperdicio. No había utilizado nunca el atributo patter en los inputs, y primera ve que veo en practica las pseudoclases valid e invalid. Sin duda cosas muy útiles.
Muy interesante el tema de formularios y sus validaciones . Cómo siempre he aprendido de tus pequeños truquillos que tanto ayudan. Impaciente a ver siguiente! Gracias.
O sea, si ya eres un gran profe por las explicaciones que das encima aumentas el valor de este curso dejando las expresiones regulares en la caja de descripción del video, jeje. Muchas gracias Jon, estoy aprendiendo tanto!
Jon gracias por este video, sobre todo css, los formularios que yo hacia era muy normalitos, mas bien feitos jaja ahora con la clase de hoy ya quedaran mas actractivos, diagamoslo asi...gracias
Me gustaria mi buen amigo jon, que hablaras con respecto a la seguridad de datos , y que mas de algun porgramador puede acceder a ese tipo de funcionalidades en el inspector , ya que lo formulario son la principal entrada de script y toca datos delicados del LocalStorage, o sql injection
Eso más que estar en el front es responsabiidad del back validar y proteger contra esos ataques, recuerda que todo lo que es front se puede inspeccionar
Jhon solo tengo agradecimiento por tan buenos tutoriales de manera gratuita que nos ofreces, quisiera hacerte una recomendación y espero no me la tomes a mal, trata de hablar un poco mas retirado del microfono, es que a veces me quedo sordo de repente cuando te acercas demasiado a él y suben demasiado los decibeles de los videos, jajaja. De nuevo gracias mil, no es una queja es solo una recomendación, pues hay muchos otros que imparten tutoriales como los tuyos quizas con un audio mas delicado pero jamas con la misma calidad y capacidad de enseñanza que tu tienes hermano, un gran abrazo bendiciones...
Hola Jon. Excelente video!!! Solo una consulta... Desde el punto de vista de seguridad los atributos HTML "required" y "Pattern" pueden ser manipulados fácilmente por el inspector de elementos. En ese sentido, entiendo que eso sería más un recurso de apoyo pero igual hay que validad con js y supongo que en el caso que se envien los datos a un servidor también validarlos con php para mayor seguridad. ¿Cierto?
Hola Jon, como siempre, excelentes tus clase que muy amablemente nos compartes, una consulta sobre validaciones, si uno por ejemplo quiere validar un correo en específico, me refiero al dominio, que se valide solo esa cadena de texto que es el dominio, ¿cómo sería? Nuevamente gracias por tu invaluable aportación
te refieres a algo como solo validar que tengan "gmail.com" o "hotmail.com" y asi? La verdad no puedo responderte como tal porque debo hacer un repaso pero si te recomiendo que pases por el canal de "FalconMasters", sus 3 últimos videos son sobre formularios y validaciones incluso con JS, pero como tal el que me ayudó a entender mejor cómo se construyen es uno que dice guia sobre expresiones regulares o algo así. Te lo recomiendo totalmente para que complementes sobre el tema, a mi me ayudó mucho a entender esto cuando estuve inventando cómo sería maquetar una página y quería que mis validaciones fueran "personalizadas" xD pero también te aconsejo que las busques en google, la verdad hoy por hoy ya muchas expresiones regulares están hechas y compartidas en la web solo es cuestión de copiarlas, aunque si te recomiendo que no solo copies, sino que entiendas. Suerte!
Buenas victor, ya que de cualquier forma la seguridad de los formularios hay que hacerlas con el backend, tu crees que es mejor usar html5 para validarlos desde el front o seguir usando js? PD: Es el mejor curso que vi.
Me estaba dando error tu regex de correo, hice este ^[a-z0-9]+(\.[_a-z0-9]+)*@[a-z0-9]+-*[a-z0-9]+\.[a-z]{2,15}$, por si alguien tiene problemas con el regex
Para los que no les funcione la validación del correo no olviden escapar también los guiones al final, - Correo: ^[a-z0-9]+(\.[_a-z0-9]+)*@[a-z0-9\-]+(\.[a-z0-9\-]+)*(\.[a-z]{2,15})$ de esta manera ya funcionara de manera correcta ya que en las clases de caracteres (dentro de corchetes []) en una expresión regular, los guiones se utilizan para definir rangos de caracteres. Para evitar confusiones, los guiones dentro de una clase de caracteres deben escaparse con una barra invertida \.
👋🏻😉
Muchas gracias me ayudo con el error que me salia
Muchísimas gracias, Alejandro! No sabía porque me daba error en la consola! Un saludo!
Todavia no puedo creer que exista una persona como jon que dedique todo el tiempo que dedica para enseñarnos todas las tecnologías en sus cursos y encima si le mandas una pregunta te responde... Una persona de otro planeta... Sos un genio jon!!!!
🤗
✅Estoy aprendiendo muchísimo ⭐️⭐️⭐️⭐️⭐️
es el mejor #curso de #javascript
😉🙌🏻
Muy buen contenido Jon, muchas gracias por compartirlo. El único detalle que quiero mencionar, es que si utilizas el atributo "title" para un mensaje de validación (como "email incorrecto"), también se muestra al pasar el mouse sobre el elemento (aún cuando esté en blanco o tenga un valor válido).
Gracias por esta serie de vídeos, saludos!!
En Edge Canary el navegador hace lo mismo que Chrome con los campos del formulario.
Excelente video.
Excelente!
Excelente Jon, no sabia algunas pseudo clases, estoy aprendiendo demasiado con este curso.
👋🏻😉
@jonmircha me quede así :0 cuando dijo que se podían usar expresiones regulares en HTML
PD: Este curso es la ostia, aprendo mas aquí que en la uni O_o
jejeje
.contact-form [required]:invalid:not(:focus):not(:placeholder-shown){
border: thick solid var(--form-error-color);
}
solo mostraria un recuadro rojo al detectar que el placeholder esta vacio y ya no tiene focus el input
😱🤓👌🏻
por comentarios como éste es que los reviso cuando termina el video, un 10 hermano!
🧙♂Muchas gracias, buen curso!!!
Gracias por comentar
Chulada de curso, gracias!
Muchas gracias!👋🏻😉
buena clase maestro
👋🏻😉
Me ha encantado tu manera de crear formularios. He aprendido algunas cosas que no sabía. Eres un gran profesional
😉👍🏻
El curso de HTML y CSS numero 3 termina justo donde empieza este capitulo 101
😎👋🏻
que genial el atributo pattern, no lo conocía, es muy útil validar así con las expresiones regulares. Genial todo lo que se puede hacer con formularios y eso que es la 1ra parte
;)
Eres un genio Jon!, mil gracias, sigo con tu curso, aprendiendo cada dia
Excelente!
Gracias Jonh
Con gusto
Excelente 👍👍
😉👋🏻
JOn.. Excelentes Videos.. Y los de los formularios es vital..para mi.. LA validaciones necesarias..Ciao. Sigo Viendo tu video
Excelente :)
te amo mirchaaaaa crack
Saludos Jon. Saludos a los compañeros. me reporto por acá nuevamente para ponerme al día con el curso. Antes de ver el video ya tenia mi maquetado del formulario. Pero el contenido del vídeo no tiene desperdicio. No había utilizado nunca el atributo patter en los inputs, y primera ve que veo en practica las pseudoclases valid e invalid. Sin duda cosas muy útiles.
;)
muy completo como siempre
Gracias! 😊
Genial!
Buenisimo
🤓👍🏻
jon estoy asiendo este formulario y estoy aprendiendo mucho♥
:) Excelente
Buenos dias. Cómo se realiza que el 'placeholder' se mueva por encima cuando se tenga el foco en el input?. Gracias.
Gracias Jon. Nuevamente renovando mi suscripción, apenas pueda subo de mecenas.
Gracias 👍
Muy interesante el tema de formularios y sus validaciones . Cómo siempre he aprendido de tus pequeños truquillos que tanto ayudan. Impaciente a ver siguiente! Gracias.
Excelente video!
Gracias!
jon GOD mircha
O sea, si ya eres un gran profe por las explicaciones que das encima aumentas el valor de este curso dejando las expresiones regulares en la caja de descripción del video, jeje. Muchas gracias Jon, estoy aprendiendo tanto!
😉👍🏻
Muchas gracias Jon por todo :)
Con gusto
I have finished this exercise, I will see your solution now
👋🏻😅
Jon gracias por este video, sobre todo css, los formularios que yo hacia era muy normalitos, mas bien feitos jaja ahora con la clase de hoy ya quedaran mas actractivos, diagamoslo asi...gracias
Que bueno :)
Gracias gracias gracias
;)
Me gustaria mi buen amigo jon, que hablaras con respecto a la seguridad de datos , y que mas de algun porgramador puede acceder a ese tipo de funcionalidades en el inspector , ya que lo formulario son la principal entrada de script y toca datos delicados del LocalStorage, o sql injection
Eso más que estar en el front es responsabiidad del back validar y proteger contra esos ataques, recuerda que todo lo que es front se puede inspeccionar
👏👏👏 🙏🙏🙏
👋🏻😉
🙌🙌🙌🙌
👋🏻😉
Jhon solo tengo agradecimiento por tan buenos tutoriales de manera gratuita que nos ofreces, quisiera hacerte una recomendación y espero no me la tomes a mal, trata de hablar un poco mas retirado del microfono, es que a veces me quedo sordo de repente cuando te acercas demasiado a él y suben demasiado los decibeles de los videos, jajaja. De nuevo gracias mil, no es una queja es solo una recomendación, pues hay muchos otros que imparten tutoriales como los tuyos quizas con un audio mas delicado pero jamas con la misma calidad y capacidad de enseñanza que tu tienes hermano, un gran abrazo bendiciones...
😉👋🏻
Jhonatan, nos puedes explicar como colocar una venta de dialogo de watsapp, seria algo genial gracias. 💪
Hola Jon. Excelente video!!! Solo una consulta... Desde el punto de vista de seguridad los atributos HTML "required" y "Pattern" pueden ser manipulados fácilmente por el inspector de elementos. En ese sentido, entiendo que eso sería más un recurso de apoyo pero igual hay que validad con js y supongo que en el caso que se envien los datos a un servidor también validarlos con php para mayor seguridad. ¿Cierto?
Independientemente de la validación front tienes que hacer validaciones en tu back
buscaba esta pregunta :)
👏🏻👏🏻👏🏻 🙏🏻🙏🏻🙏🏻
😉👋🏻
Hola Jon, como siempre, excelentes tus clase que muy amablemente nos compartes, una consulta sobre validaciones, si uno por ejemplo quiere validar un correo en específico, me refiero al dominio, que se valide solo esa cadena de texto que es el dominio, ¿cómo sería? Nuevamente gracias por tu invaluable aportación
te refieres a algo como solo validar que tengan "gmail.com" o "hotmail.com" y asi? La verdad no puedo responderte como tal porque debo hacer un repaso pero si te recomiendo que pases por el canal de "FalconMasters", sus 3 últimos videos son sobre formularios y validaciones incluso con JS, pero como tal el que me ayudó a entender mejor cómo se construyen es uno que dice guia sobre expresiones regulares o algo así. Te lo recomiendo totalmente para que complementes sobre el tema, a mi me ayudó mucho a entender esto cuando estuve inventando cómo sería maquetar una página y quería que mis validaciones fueran "personalizadas" xD pero también te aconsejo que las busques en google, la verdad hoy por hoy ya muchas expresiones regulares están hechas y compartidas en la web solo es cuestión de copiarlas, aunque si te recomiendo que no solo copies, sino que entiendas. Suerte!
Buenas victor, ya que de cualquier forma la seguridad de los formularios hay que hacerlas con el backend, tu crees que es mejor usar html5 para validarlos desde el front o seguir usando js? PD: Es el mejor curso que vi.
Yo uso una mezcla de ambos html y js ;)
y sin javascript super !!
😉👍🏻
Nota a mi mismo, no debo pausar los videos.
Dibuje un loader.svg y estuve media hora para que gire.
Al rato, Jon muestra las @keyframes 🤦🤦🤦
🤣🤣🤣🤣 ruclips.net/video/mVhoGXkDbMw/видео.html
🧙♂️🧙♂️🧙♂️
🙌🏻🙌🏻🙌🏻
Profe, y si un usuario dañino borrara el atributo "pattern" desde el inspector de elementos, ¿nos quedaríamos sin validación?
Sí por eso siempre hay que validar en JS y en el back
en el data-pattern del txtarea le puedo poner cualquier otro nombre, profe ?
Mientras empiece con data- , si
Profe, si pongo un email tipo "mi_super_email@hotmail.com" no lo toma como válido la expresión regular
:O
Me pasa lo mismo, incluso poniendo emails reales, que uso. Me dice , "haz coincidir el Formato solicitado" 😢
Profe es recomendable usar javascript para juegos o hay un lenguaje más específico para ese tipo de tareas?
Depende del Engine con el que trabajes
Me estaba dando error tu regex de correo, hice este ^[a-z0-9]+(\.[_a-z0-9]+)*@[a-z0-9]+-*[a-z0-9]+\.[a-z]{2,15}$, por si alguien tiene problemas con el regex
👋🏻😉