Alterando a mensagem do atributo required do HTML5
Recentemente tive que desenvolver um projeto em espanhol e como de costume coloquei o atributo required para validar os campos de um formulário, com o andamento do projeto verifiquei que a mensagem de validação sempre vinha em português, pois é pego como referência a lingua do browser.
Como este projeto estava em outra língua e não seria visto somente por pessoas com navegadores em espanhol, tive que alterar esta mensagem
Até que alterar o campos do tipo texto ou input não é nada complicado, porém este formulário tinha alguns checkboxs, eis que surge a dificuldade.
Irei explicar aqui como alterar o texto desta mensagem para qualquer uma de sua escolha
Para input dos tipos "text", "textarea", "select", "password" entre outros
<input type="text" required oninvalid="this.setCustomValidity('mensagem de sua preferência')" oninput="setCustomValidity('')">
Veja abaixo um exemplo em funcionamento
Para input do tipo "radio"
<input type="radio" name="teste" id="nome_id" required oninvalid="this.setCustomValidity('mensagem de sua preferência')" onclick="clearValidity('')">
<input type="radio" name="teste" required onclick="clearValidity('')">
<script>
function clearValidity() {
document.getElementById('ley1').setCustomValidity('');
}
</script>
Veja abaixo o exemplo em funcionamento