Bom, implementei o google reCAPTCHA nos formulários do meu site, funcionando normal, porém é possível enviar os formulários sem selecionar o captcha, como faço para ele ser um campo obrigatório antes do submit como um "required" ?
-
Você colocou o reCAPTCHA dentro da tag <form> ? acredito que essa adição ao site ja o torna obrigatório.– Bsalvo11/10/2017 às 11:48
-
Sim está dentro do <form> , será que poderia ser porque estou testando em um servidor local?– HBretone11/10/2017 às 11:49
-
2Muito provavelmente pode ser isso, você ja deu uma olhada na documentação ?, de uma testada na resposta também acho que pode funcionar, mas lembrando que utilizo reCAPTCHA nos meus sites e nunca precisei validar manualmente.– Bsalvo11/10/2017 às 11:50
Adicione um comentário
|
2 Respostas
Eu achei isso é acredito ser a maneira mais rápida para implementar, adicione esse codigo ao seu header
<script>
window.onload = function() {
var recaptcha = document.forms["Seu-Form"]["g-recaptcha-response"];
recaptcha.required = true;
recaptcha.oninvalid = function(e) {
// fazer algo, no caso to dando um alert
alert("Por favor complete o captchaba");
}
}
</script>
Obs: Isso funciona apenas com Html5, é uma solução rápida para seu problema.
-
-
Isso, qualquer problema chama nos comentários que resolvemos. 11/10/2017 às 12:05
-
-
Consegui, estava errando uma coisa aqui, fiz do jeito que você colocou muito obrigado.– HBretone11/10/2017 às 12:10
Use reCaptcha callback with jquery.validate
$(document).ready(function () {
$("#form").validate();
$("#btnSubmit").prop("disabled", ($("#Form1").valid() ? false : "disabled"));
});
function recaptchaCallback(response) {
$("#hidden-grecaptcha").val(response);
$("#btnSubmit").prop("disabled", ($("#Form1").valid() ? false : "disabled"));
};
function recaptchaExpired() {
$("#hidden-grecaptcha").val("");
$("#btnSubmit").prop("disabled", ($("#Form1").valid() ? false : "disabled"));
};
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.validate.js"></script>
<form id="Form1" method="post" action="">
<div class="g-recaptcha" data-sitekey="xxx-xxxxxxxxxxxxxxxx-xx-x" data-callback="recaptchaCallback" data-expired-callback="recaptchaExpired"></div>
<input type="text" id="hidden-grecaptcha" name="hidden-grecaptcha" style="opacity: 0; position: absolute; top: 0; left: 0; height: 1px; width: 1px;" />
<br />
<button id="btnSubmit" type="submit">Send</button>
</form>