Como fazer VALIDAÇÃO de FORMULÁRIOS com JavaScript

Поділитися
Вставка
  • Опубліковано 23 лис 2024

КОМЕНТАРІ • 91

  • @cristianpereira3259
    @cristianpereira3259 2 роки тому +3

    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.

  • @brunoferreiraadev
    @brunoferreiraadev 2 роки тому +2

    Esse cara é muito bom, ensina de uma maneira fácil de aprender, meus parabéns!!!👋👋👋

  • @dev_Augusto
    @dev_Augusto 7 місяців тому

    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.

  • @priscilaa.7981
    @priscilaa.7981 Місяць тому +2

    Gratidão Gustavo.

  • @francish886
    @francish886 Рік тому +2

    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!

  • @Maxnovais777
    @Maxnovais777 2 роки тому +3

    O mano faz um vídeo desenvolvendo uma página em HTML e CSS e Javascript sei lá

  • @fbelfort_
    @fbelfort_ 2 роки тому

    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!

  • @haydukieder
    @haydukieder 2 роки тому +4

    cara, como esse canal tem poucos inscritos e poucas interações nos comentários. que didática boa pra caramba.

  • @anonimux6612
    @anonimux6612 2 роки тому +2

    Seu canal é incrível para os iniciantes. Parabéns

  • @flaviovalentim1575
    @flaviovalentim1575 Рік тому

    Parabéns Gustavo, muito bom a didatica para apresentação do assunto, só senti falta da validação com select

  • @danielfrausino7596
    @danielfrausino7596 Рік тому

    Gosto muito dos seus vídeos, eu aprendo bastanto me destraio e nss muito bom parabéns cara você é o melhor ❣️

  • @klebercoelho99
    @klebercoelho99 Рік тому

    simplesmente obrigado, estava realmente precisando disso, estava com dificuldade em um projeto do meu curso e esse vídeo me ajudou muito!!!

  • @jacsonandreola4360
    @jacsonandreola4360 Рік тому +1

    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?

  • @lisianeneitzke6045
    @lisianeneitzke6045 2 роки тому +1

    Com certeza cada dia melhor 👏👏👏

  • @dihcavallcantegame
    @dihcavallcantegame 2 роки тому +2

    Você é fera demais men, ta me ajudando demais na área da programação

  • @renanaragao1957
    @renanaragao1957 2 роки тому +2

    sempre com otimas aulas

  • @aprendizdefunileiro9281
    @aprendizdefunileiro9281 Рік тому +1

    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!

    • @nicollasfernandes4315
      @nicollasfernandes4315 Рік тому

      sim mano nunca pensei em criar uma funçao para dar setError para economizar linhas

  • @sameernasri5892
    @sameernasri5892 Рік тому

    Muito foda seu conteúdo! To entrando na área de programação e teus vídeos ajudam bastante.

  • @matheusprogramador
    @matheusprogramador Рік тому +1

    Um dos poucos fora o Guanabara que explicam muito bem! Tirou muita onda irmão!

    • @treinonossodecadadia8014
      @treinonossodecadadia8014 Рік тому

      cara, do que adianta um video inconclusivo. o cara validou e ai? como envia o formulario? a parte mais importante nao fez

    • @levisanches1636
      @levisanches1636 Рік тому +1

      @@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.

    • @treinonossodecadadia8014
      @treinonossodecadadia8014 Рік тому

      @@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

  • @danielfernandes5182
    @danielfernandes5182 2 роки тому +1

    Tu é bom, mano! Manda muito bem!

  • @oistaili
    @oistaili 2 роки тому +1

    muito obrigado pelo aula irmão!!

  • @johnatanchagas8243
    @johnatanchagas8243 Рік тому

    Bora lançar mais vídeos do curso de javascript kkkk! Muito bom! parabéns pelo canal e ótimos conteúdos!

  • @ICodEPT
    @ICodEPT 9 місяців тому +1

    Brabo! Eu não conhecia seu canal. Ganhou um adepto. rs Parabéns 👏👏👏

  • @junninxd
    @junninxd Рік тому

    Mano, AULA ESPETACULAR! Ajudou muito!

  • @mayconrocha8723
    @mayconrocha8723 7 місяців тому

    Sensacional demais Gustavo.

  • @matheussoareslima3498
    @matheussoareslima3498 2 роки тому +1

    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

    • @levisanches1636
      @levisanches1636 Рік тому

      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

  • @andremonteiro1369
    @andremonteiro1369 Рік тому

    Faz um desse real, salvando em algum banco de dados e mostrando no banco.
    Obrigado, pela aula.

  • @shxgamer3028
    @shxgamer3028 2 місяці тому +2

    Alguém tem o código inteiro para me dar? do html e js

  • @nandorace
    @nandorace 2 роки тому +4

    Poderia complementar esse vídeo inserindo esses dados em um banco de dados?

    • @GustavoNeitzke
      @GustavoNeitzke  2 роки тому +1

      Olá Fernando! Sim, já temos um vídeo ensinando exatamente isso aqui no canal ua-cam.com/video/QOeDE7nPDq0/v-deo.html

  • @LouvadoIsaias-cn3np
    @LouvadoIsaias-cn3np 6 місяців тому

    Você me ajudou muito cara

  • @アラウーホムリーロ

    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? "

  • @MauricioCaiombe
    @MauricioCaiombe Рік тому +1

    Mano PARABÉNS

  • @Paulo_Mateus
    @Paulo_Mateus Рік тому +3

    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.

    • @saturnvibes
      @saturnvibes 6 місяців тому

      cara, você consegui contornar esse problema?

  • @gildasiooliveira8915
    @gildasiooliveira8915 6 місяців тому

    Excelente!

  • @CachorroCururu
    @CachorroCururu 5 місяців тому +3

    Melhor que muito curso caro, Alô dona EBAC... Rsrsrs

    • @fcgames7671
      @fcgames7671 5 місяців тому

      Estou fazendo eback , vim aqui para me tirar dúvidas, sobre validação..

  • @treinonossodecadadia8014
    @treinonossodecadadia8014 Рік тому +7

    so n entendi uma coisa, beleza, ta validando. mas e a parte mais importante? como enviar esse formulario para o php?

  • @cklevertytimbakcl6029
    @cklevertytimbakcl6029 Рік тому

    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

  • @pedrocfreitas
    @pedrocfreitas Рік тому

    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 ; ....

  • @aprendizdefunileiro9281
    @aprendizdefunileiro9281 Рік тому

    fala Gustavo blz, qual tema de cores você utiliza ?

  • @gomessIeo
    @gomessIeo Рік тому

    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?

  • @danielfrausino7596
    @danielfrausino7596 Рік тому

    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 🙏❤️

  • @nandorace
    @nandorace 2 роки тому

    Faltou no submit colocar a função no textarea e no type radio

  • @_alicest
    @_alicest Рік тому +1

    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.

    • @rogeriosamuel3593
      @rogeriosamuel3593 4 дні тому

      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!

  • @alexandremarciliocruz67
    @alexandremarciliocruz67 2 роки тому

    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

  • @eduardoborgesgg
    @eduardoborgesgg Рік тому

    depois que eu fiz as alterações meu botão de enviar não está mais funcionando, sabe me dizer o por que?

  • @denilsonnunes1745
    @denilsonnunes1745 Рік тому

    Faltou só a validação dos campos do tipo checkbox e radio

  • @Vini-xe1dc
    @Vini-xe1dc 2 роки тому +1

    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?

    • @GustavoNeitzke
      @GustavoNeitzke  2 роки тому

      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,...

    • @Vini-xe1dc
      @Vini-xe1dc 2 роки тому

      @@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 :(

    • @lucianooliveira5809
      @lucianooliveira5809 2 роки тому

      ​@@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();
      }
      });

  • @pierreleal395
    @pierreleal395 Рік тому +1

    Brabo dms

  • @sonapj9321
    @sonapj9321 Рік тому

    Valeu ✌🏾

  • @JoaoVictor-jg6dc
    @JoaoVictor-jg6dc 2 роки тому

    O que esse index faz? Como, por exemplo, na função setError(index)

    • @paulovictorrodrigues5994
      @paulovictorrodrigues5994 2 роки тому +1

      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,

  • @conhecimento3944
    @conhecimento3944 11 місяців тому

    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?

    • @ViaAutodidata
      @ViaAutodidata 4 місяці тому

      Fala mano, descobriu como resolve? estou com o mesmo problema

  • @_opredolive_
    @_opredolive_ Рік тому

    Mas como que envia dps?

  • @LM_Producoes
    @LM_Producoes Рік тому +2

    Qual o link do repositorio para poder pegar o link do regex?

    • @shxgamer3028
      @shxgamer3028 2 місяці тому +1

      Aqui caso ainda precise /^\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/

  • @mateuscosta1269
    @mateuscosta1269 5 місяців тому

    nao consigo "enviar" os dados. Mesmo os dados nos inputs contendo os criterios de validação, o botao enviar nn os envia. Como resolvo?

    • @ViaAutodidata
      @ViaAutodidata 4 місяці тому

      Opa, descobriu? estou com o mesmo problema...

  • @guilhermemillersilva6016
    @guilhermemillersilva6016 2 роки тому

    Estou tentando fazer para telefone mas não estou conseguindo

  • @renanclemonini1844
    @renanclemonini1844 Рік тому

    como faz para remover o event listener e permitir que ele aceite fazer o envio do formulário?

    • @ViaAutodidata
      @ViaAutodidata 4 місяці тому

      Opa, descobriu como faz? estou com o mesmo problema...

  • @peter8796
    @peter8796 2 роки тому

    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?

    • @paulovictorrodrigues5994
      @paulovictorrodrigues5994 2 роки тому

      Remove o e.preventDefault() do seu script e no botão no html coloca propriedade type="submit"

  • @blockfolio8225
    @blockfolio8225 2 роки тому +1

    Cara e pra enviar voce ensinou a validar e depois de validado nao envia lol!

    • @GustavoNeitzke
      @GustavoNeitzke  2 роки тому +1

      Olá amigo! Já ensinamos isso no canal. Aprenda como ligar um FORMULÁRIO com BANCO DE DADOS #01
      ua-cam.com/video/QOeDE7nPDq0/v-deo.html

  • @peter8796
    @peter8796 2 роки тому +3

    como que faz o botao do submit funcionar e salvar as informações, pelo amor de Deus kkkkkkkkkkkk

    • @lucianooliveira5809
      @lucianooliveira5809 2 роки тому +1

      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();
      }
      });

  • @timoteosilva3603
    @timoteosilva3603 9 місяців тому

    COmo vocÊ aprendeu tudo isso? kkk
    Quero fazer um curso

    • @GustavoNeitzke
      @GustavoNeitzke  12 днів тому

      Buenass! Agora temos um curso de HTML e CSS na neitzkeacademy.com/geral/courses/1536bddf-8bc8-4dbf-bbad-cde5e136e1c0

  • @et_gigii
    @et_gigii 2 місяці тому

    EU ODEIO JAVASCRPT