Olá! Sou novato no javascript, mas já tenho uma necessidade. hehe Estou montando um formulário que obrigue a pessoa a selecionar uma checkbox antes de clicar no submit. Se clicado no botão sem selecionar a caixa de seleção, deve aparecer uma mensagem de erro. Como fazer no javascript? =)
Solucionado (ver solução)
Solucionado
(ver solução)
5
respostas
respostas
Checar o preenchimento do checkbox
Oi Victor, tudo bom? para isso seria legal vc entender como a linguagem do JS se integra com o browser e quais eventos podemos mandar para ele e vice-versa. Temos esse curso de Validação de Formulários com JS que pode te ajudar https://cursos.alura.com.br/course/validacao-javascript-html5
Oi, Vitor, tudo bem?
O HTML5 tem uma espedificação dentro do input que facilita muito esse processo de validação que é o required, ele transforma os valores dos inputs obrigatórios, ou seja, quando adicionando o required o usuário não poderará submeter sem marcar uma opção, um exemplo:
<input type="checkbox" id="vehicle1" name="vehicle1" value="Bike" required >Espero ter te ajudado!
Oi, eu estou fazendo o curso de javascript, é que a necessidade era urgente. E Laís, eu já estou o required do html, hehe. Eu queria que aparecesse uma mensagem mais amigável ao usuário. Por enquanto eu fiz uma gambiarra com php, mas é temporário.
solução!
Oi, Victor.
Você pode utilizar o evento invalid para te auxiliar juntamente com o método setCustomValidity(), ficando assim:
<input type="checkbox" id="vehicle1" name="vehicle1" value="Bike" required oninvalid="this.setCustomValidity('Campo obrigatório')">Agora, você pode por uma mensagem personalizada para o usuário. Para saber mais: https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/invalid_event
https://developer.mozilla.org/en-US/docs/Web/API/HTMLSelectElement/setCustomValidity
Espero que te ajude :}
Obrigado! Vai ajudar muito! =)