Parabéns Gustavo Neitzke por este seu trabalho, nós precisamos muito de sua dedicação e profissionalismo para nos ajudar neste início de profissão programador, pois é por meio destes tutoriais que ganhamos força e enriquecemos os nossos conhecimentos para ingressar nesta área tão complexa para alguns como eu. Pois a cada dia um novo desafio, atualizações repentinas que enfrentamos, então mais uma vez muito obrigado e nunca para de nos ajudar.
Dei uma pausa na codagem aqui para agradecer a você, Gustavo, pelo excelente trabalho que está ajudando não só a mim mas também a várias outras pessoas.
Fala Gustavo, muito obrigado por esse video, tava quebrando a cabeça aqui pra fazer validação e tu me ajudou demais, valeu mesmo! Graças ao teu video consegui validar meu formulario!
Fala Gustavo beleza ? Mano, quero te agradecer por fazer videos como esse. Esse tipo de video é muito util pra mim que estou estudando Js, eu descubri varias coisas que eu não utilizava em meus codigos, a forma que você utiliza funçoes e utiliza o seletor de objetos (qurySelectorall) abriu a minha mente para varia possibilidades e simplicidade de fazer codigos mais curtos e objetivos com facil modificação. Deus abençoe sua vida irmao sucesso!
@@treinonossodecadadia8014 cara... um passo de cada vez, o tema do vídeo é sobre validação. se for o caso ele faz a continuação depois mostrando o envio e etc.
@@levisanches1636 kkk e tipo vc ensinar o cara a dirigir pelo video game. Qual a função de um formulário? Enviar msg, a parte mais importante n fez kk ainda acha normal
Mano estou com um problema na ultima parte 24:00, o event prevault simplesmente está impedindo de enviar enviar a mensagem, ao clicar no botão submit ele não envia mais como antes.
Ganhou uma inscrita! Excelente conteúdo, didática simples e compreensível. Estou criando um form pra um website e após a validação ele não vai pra página principal do site, já rodei meio mundo e não consegui resolver, quem puder dar uma mãozinha eu fico agradecida!
Oiii!! vim tirar uma dúvida. Quando eu clico no botão do tipo submit não acontece nada e eu coloquei no form o action="salvar.php" para salvar no banco. Então vim vê se alguem q testou esse cod funcionou salvando no banco dados :/. E esse mesmo salvar.php funciona se eu colocar no botão inves de button para input, mas o script não funciona.
Moça, tive o mesmo problema e fui pesquisar sobre. Acontece que o 'event.preventDefault( )' impede o envio do formulário, mesmo que as validações sejam bem-sucedidas. Isso significa que o formulário nunca chega ao backend. Para corrigir, você deve garantir que o 'preventDefault( )' só seja usado se houver erros de validação. Eu fiz isso atráves de uma estrutuda de decisão if else. Exemplo form.addEventListener("submit", (event) => { validarNome(); validarEmail(); validarSenha(); // Se todas as validações passarem, o formulário pode ser enviado if (document.querySelectorAll('.span-required[style*="block"]').length === 0) { form.submit(); // Envia o formulário } else { event.preventDefault(); } }); Espero ter ajudado!
E aí, estou com uma dificuldade no envio do formulário ao banco de dados. Como fazer? A conexão ja foi feita com php mas os dados do formulário n aparecem la, ele simplesmente cria os ID’s
Na function mainPasswordValidate não seria necessário chamar a função comparePassword é inútil , pois ela é chamada no onInput lá em cima a parti do momento que o usuário digita algo , sendo nesse momento ela é invocada diretamente e não sendo necessário chamar ela duas vezes Muito bom o conteúdo é uma só uma observação no código
nesse caso é necessário sim, basta fazer o teste de colocar a senha, repetir a mesma... depois mude a senha novamente, a validação precisa acusar novamente que a senha não é equivalente, por isso a necessidade de chamar a função dentro main
A validação funcionou perfeitamente mas o event.preventDefault(); não deixa meu formulário ser enviado mesmo com todos os campos preenchidos corretamente, o que eu faço?
Opa Vini! Exatamente, com o preventDefault os dados do formulário não são enviados, logo você precisa fazer um envio dos dados diretamente no JavaScript, pode utilizar um axios, fetch,...
@@GustavoNeitzke Então o meu insert feito em PHP não vai mais funcionar se eu usar essa validação? teria que fazer o insert no banco utilizando o javascript? sou iniciante em javascript e não entendi muito bem, pensei que esse código faria somente a validação e o meu código php seria responsável por enviar os dados para o bd, já que o crud funciona se eu retirar o preventDefault :(
@@Vini-xe1dc Opa, não sei se vai servir pra vc, mas aqui eu consegui contornar esse problema da seguinte maneira. Dentro da função anônima, ao invés de deixar o prevent.default "solto", eu coloquei ele (e a função de validação) dentro de um if, mudei o evento de submit pra click e add o evento no botão e não no form, assim: btn.addEventListener('click', (event) => { if(email.value == '' "){ event.preventDefault(); emailValidation(); } });
O meu código dá erro na função comparePassword eu coloco o seu código igualzinho no sublime e executo e o navegador apresenta erro no value dos campos[2].value e campos[3] não consegue encontrar o value para os campos O restante do código foi de boa
Muito bom esse vídeo. Só ficou a pergunta na minha cabeça: "Essas são todos os tipos de validações de formulário? Ou existe mais tipos e formais de validar elementos de um formulário? "
cara, no caso eu ja to com meu projeto conectado ao banco, so que quando eu clico para enviar o formulario nao acontece nada, e tbm nao salva, alguem sabe me dizer oque eu faço?
Quando ele deu um querySelectorAll pelo que entendi, ele cria um array dos inputs. Cada input tem uma posição que vai de 0 a N. Quando ele chama a função setError(0) ta pegando a posição de um determinado input. O index entre parenteses é um parâmetro, você pode escrever qualquer coisa ali para referenciar que vai entrar algum dado tipo function setError(dado). Ele colocou index pois é comum essa palavra para referenciar arrays,
Opa mano ótimo vídeo, tenho uma dúvida, este ultimo código form.addEventListener('submit', (event) => { event.preventDefault(); validarNome(); validarEmail(); validarSenha(); compararSenha(); }) está bloqueando meu formulário ao clicar em submit para meu banco de dados, tem como me ajudar?
Eu consegui contornar esse problema da seguinte maneira. Dentro da função anônima, ao invés de deixar o prevent.default "solto", eu coloquei ele (e a função de validação) dentro de um if, mudei o evento de submit pra click e add o evento no botão e não no form, assim: btn.addEventListener('click', (event) => { if(email.value == '' "){ event.preventDefault(); emailValidation(); } });
Parabéns Gustavo Neitzke por este seu trabalho, nós precisamos muito de sua dedicação e profissionalismo para nos ajudar neste início de profissão programador, pois é por meio destes tutoriais que ganhamos força e enriquecemos os nossos conhecimentos para ingressar nesta área tão complexa para alguns como eu. Pois a cada dia um novo desafio, atualizações repentinas que enfrentamos, então mais uma vez muito obrigado e nunca para de nos ajudar.
Dei uma pausa na codagem aqui para agradecer a você, Gustavo, pelo excelente trabalho que está ajudando não só a mim mas também a várias outras pessoas.
Fala Gustavo, muito obrigado por esse video, tava quebrando a cabeça aqui pra fazer validação e tu me ajudou demais, valeu mesmo! Graças ao teu video consegui validar meu formulario!
Gratidão Gustavo.
Esse cara é muito bom, ensina de uma maneira fácil de aprender, meus parabéns!!!👋👋👋
cara, como esse canal tem poucos inscritos e poucas interações nos comentários. que didática boa pra caramba.
O próprio youtube bloqueia
meu Deus até quem fim eu aprendi isso 🙏🙏🙏🙏
Seu canal é incrível para os iniciantes. Parabéns
Você é fera demais men, ta me ajudando demais na área da programação
sempre com otimas aulas
Com certeza cada dia melhor 👏👏👏
simplesmente obrigado, estava realmente precisando disso, estava com dificuldade em um projeto do meu curso e esse vídeo me ajudou muito!!!
Gosto muito dos seus vídeos, eu aprendo bastanto me destraio e nss muito bom parabéns cara você é o melhor ❣️
Tu é bom, mano! Manda muito bem!
Fala Gustavo beleza ?
Mano, quero te agradecer por fazer videos como esse. Esse tipo de video é muito util pra mim que estou estudando Js, eu descubri varias coisas que eu não utilizava em meus codigos, a forma que você utiliza funçoes e utiliza o seletor de objetos (qurySelectorall) abriu a minha mente para varia possibilidades e simplicidade de fazer codigos mais curtos e objetivos com facil modificação. Deus abençoe sua vida irmao sucesso!
sim mano nunca pensei em criar uma funçao para dar setError para economizar linhas
Sensacional demais Gustavo.
Um dos poucos fora o Guanabara que explicam muito bem! Tirou muita onda irmão!
cara, do que adianta um video inconclusivo. o cara validou e ai? como envia o formulario? a parte mais importante nao fez
@@treinonossodecadadia8014 cara... um passo de cada vez, o tema do vídeo é sobre validação. se for o caso ele faz a continuação depois mostrando o envio e etc.
@@levisanches1636 kkk e tipo vc ensinar o cara a dirigir pelo video game. Qual a função de um formulário? Enviar msg, a parte mais importante n fez kk ainda acha normal
Brabo! Eu não conhecia seu canal. Ganhou um adepto. rs Parabéns 👏👏👏
Mano, AULA ESPETACULAR! Ajudou muito!
Parabéns Gustavo, muito bom a didatica para apresentação do assunto, só senti falta da validação com select
Mano estou com um problema na ultima parte 24:00, o event prevault simplesmente está impedindo de enviar enviar a mensagem, ao clicar no botão submit ele não envia mais como antes.
cara, você consegui contornar esse problema?
Muito foda seu conteúdo! To entrando na área de programação e teus vídeos ajudam bastante.
Bora lançar mais vídeos do curso de javascript kkkk! Muito bom! parabéns pelo canal e ótimos conteúdos!
muito obrigado pelo aula irmão!!
Showww, me ajudou muito. Dexia te pedir uma coisa, tu tem alguma aula onde ensine a validar se já tem um e-mail ou usuário cadastrado?
Excelente!
Ganhou uma inscrita! Excelente conteúdo, didática simples e compreensível. Estou criando um form pra um website e após a validação ele não vai pra página principal do site, já rodei meio mundo e não consegui resolver, quem puder dar uma mãozinha eu fico agradecida!
Alguém tem o código inteiro para me dar? do html e js
Mano PARABÉNS
O mano faz um vídeo desenvolvendo uma página em HTML e CSS e Javascript sei lá
Você me ajudou muito cara
Brabo dms
Melhor que muito curso caro, Alô dona EBAC... Rsrsrs
Estou fazendo eback , vim aqui para me tirar dúvidas, sobre validação..
Poderia complementar esse vídeo inserindo esses dados em um banco de dados?
Olá Fernando! Sim, já temos um vídeo ensinando exatamente isso aqui no canal th-cam.com/video/QOeDE7nPDq0/w-d-xo.html
fala Gustavo blz, qual tema de cores você utiliza ?
Valeu ✌🏾
so n entendi uma coisa, beleza, ta validando. mas e a parte mais importante? como enviar esse formulario para o php?
tbm to com a mesma duvida
Ele tem uma aula sobre isso...
Vai ver lá no perfil dele
Faz um desse real, salvando em algum banco de dados e mostrando no banco.
Obrigado, pela aula.
Oiii!! vim tirar uma dúvida. Quando eu clico no botão do tipo submit não acontece nada e eu coloquei no form o action="salvar.php" para salvar no banco. Então vim vê se alguem q testou esse cod funcionou salvando no banco dados :/. E esse mesmo salvar.php funciona se eu colocar no botão inves de button para input, mas o script não funciona.
Moça, tive o mesmo problema e fui pesquisar sobre.
Acontece que o 'event.preventDefault( )' impede o envio do formulário, mesmo que as validações sejam bem-sucedidas. Isso significa que o formulário nunca chega ao backend.
Para corrigir, você deve garantir que o 'preventDefault( )' só seja usado se houver erros de validação. Eu fiz isso atráves de uma estrutuda de decisão if else. Exemplo
form.addEventListener("submit", (event) => {
validarNome();
validarEmail();
validarSenha();
// Se todas as validações passarem, o formulário pode ser enviado
if (document.querySelectorAll('.span-required[style*="block"]').length === 0) {
form.submit(); // Envia o formulário
} else {
event.preventDefault();
}
});
Espero ter ajudado!
Ficou só uma dúvida, pq quando clico para enviar o form, com todos os campos validados, ele não "reseta" como se tivesse enviado?
E aí, estou com uma dificuldade no envio do formulário ao banco de dados. Como fazer?
A conexão ja foi feita com php mas os dados do formulário n aparecem la, ele simplesmente cria os ID’s
Na function mainPasswordValidate não seria necessário chamar a função comparePassword é inútil , pois ela é chamada no onInput lá em cima a parti do momento que o usuário digita algo , sendo nesse momento ela é invocada diretamente e não sendo necessário chamar ela duas vezes
Muito bom o conteúdo é uma só uma observação no código
nesse caso é necessário sim, basta fazer o teste de colocar a senha, repetir a mesma... depois mude a senha novamente, a validação precisa acusar novamente que a senha não é equivalente, por isso a necessidade de chamar a função dentro main
porq toda vez que clico pra validar, algum função para de funcionar? estou colando a validação no mesmo botão em dois "onclik" separado por ; ....
Qual o link do repositorio para poder pegar o link do regex?
Aqui caso ainda precise /^\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/
A validação funcionou perfeitamente mas o event.preventDefault(); não deixa meu formulário ser enviado mesmo com todos os campos preenchidos corretamente, o que eu faço?
Opa Vini! Exatamente, com o preventDefault os dados do formulário não são enviados, logo você precisa fazer um envio dos dados diretamente no JavaScript, pode utilizar um axios, fetch,...
@@GustavoNeitzke Então o meu insert feito em PHP não vai mais funcionar se eu usar essa validação? teria que fazer o insert no banco utilizando o javascript? sou iniciante em javascript e não entendi muito bem, pensei que esse código faria somente a validação e o meu código php seria responsável por enviar os dados para o bd, já que o crud funciona se eu retirar o preventDefault :(
@@Vini-xe1dc Opa, não sei se vai servir pra vc, mas aqui eu consegui contornar esse problema da seguinte maneira. Dentro da função anônima, ao invés de deixar o prevent.default "solto", eu coloquei ele (e a função de validação) dentro de um if, mudei o evento de submit pra click e add o evento no botão e não no form, assim:
btn.addEventListener('click', (event) => {
if(email.value == '' "){
event.preventDefault();
emailValidation();
}
});
depois que eu fiz as alterações meu botão de enviar não está mais funcionando, sabe me dizer o por que?
O meu código dá erro na função comparePassword eu coloco o seu código igualzinho no sublime e executo e o navegador apresenta erro no value dos campos[2].value e campos[3] não consegue encontrar o value para os campos
O restante do código foi de boa
Muito bom esse vídeo. Só ficou a pergunta na minha cabeça: "Essas são todos os tipos de validações de formulário? Ou existe mais tipos e formais de validar elementos de um formulário? "
Mas como que envia dps?
O mano faz um vídeo mostrando como faço pra caso se a senha for valida me direcionar para o meu site por favor 🙏❤️
Faltou no submit colocar a função no textarea e no type radio
nao consigo "enviar" os dados. Mesmo os dados nos inputs contendo os criterios de validação, o botao enviar nn os envia. Como resolvo?
Opa, descobriu? estou com o mesmo problema...
como faz para remover o event listener e permitir que ele aceite fazer o envio do formulário?
Opa, descobriu como faz? estou com o mesmo problema...
Estou tentando fazer para telefone mas não estou conseguindo
Cara e pra enviar voce ensinou a validar e depois de validado nao envia lol!
Olá amigo! Já ensinamos isso no canal. Aprenda como ligar um FORMULÁRIO com BANCO DE DADOS #01
th-cam.com/video/QOeDE7nPDq0/w-d-xo.html
cara, no caso eu ja to com meu projeto conectado ao banco, so que quando eu clico para enviar o formulario nao acontece nada, e tbm nao salva, alguem sabe me dizer oque eu faço?
Remove o e.preventDefault() do seu script e no botão no html coloca propriedade type="submit"
O que esse index faz? Como, por exemplo, na função setError(index)
Quando ele deu um querySelectorAll pelo que entendi, ele cria um array dos inputs. Cada input tem uma posição que vai de 0 a N. Quando ele chama a função setError(0) ta pegando a posição de um determinado input. O index entre parenteses é um parâmetro, você pode escrever qualquer coisa ali para referenciar que vai entrar algum dado tipo function setError(dado). Ele colocou index pois é comum essa palavra para referenciar arrays,
Opa mano ótimo vídeo, tenho uma dúvida, este ultimo código
form.addEventListener('submit', (event) => {
event.preventDefault();
validarNome();
validarEmail();
validarSenha();
compararSenha();
})
está bloqueando meu formulário ao clicar em submit para meu banco de dados, tem como me ajudar?
Fala mano, descobriu como resolve? estou com o mesmo problema
Faltou só a validação dos campos do tipo checkbox e radio
como que faz o botao do submit funcionar e salvar as informações, pelo amor de Deus kkkkkkkkkkkk
Eu consegui contornar esse problema da seguinte maneira. Dentro da função anônima, ao invés de deixar o prevent.default "solto", eu coloquei ele (e a função de validação) dentro de um if, mudei o evento de submit pra click e add o evento no botão e não no form, assim:
btn.addEventListener('click', (event) => {
if(email.value == '' "){
event.preventDefault();
emailValidation();
}
});
COmo vocÊ aprendeu tudo isso? kkk
Quero fazer um curso
Buenass! Agora temos um curso de HTML e CSS na neitzkeacademy.com/geral/courses/1536bddf-8bc8-4dbf-bbad-cde5e136e1c0
EU ODEIO JAVASCRPT