1

Estou realizando o cadastro de um formulário com Ajax, como implementar o uso do reCaptcha?

<input type="text" name="email" id="email" class="form-control" placeholder="Email" required>
<div class="g-recaptcha" data-sitekey="bla,bla,bla"></div>
<input type="button" onclick="add_comment()" value="Enviar comentário" class="btn btn-primary pull-right"></button>

A Função 'add_comment()':

function add_comment() {
var url = 'comentarios/add_comment.php';
var method = 'POST';
params += '&email='+document.getElementById('email').value;
var container_id = 'comment-box' ;
var loading_text = '<img src="loader.gif">' ;
ajax (url, method, params, container_id, loading_text) ;
}

Setando um id no reCaptcha é retornado o valor 'undefined' A função funciona perfeitamente com cadastro, como posso enviar o valor do reCaptcha para a função e valida-la no arquivo .php?

Vlw

2 Respostas 2

2

Partindo do princípio que o valor do captcha correto fica no atributo "data-sitekey" da div ".g-recaptcha"

talvez isso resolva: (importante: estou utilizando jquery, certifique-se de ter incluido a biblioteca jquery)

<input type="text" name="email" id="email">
<input type="text" name="captcha" id="captcha">
<div class="g-recaptcha" data-sitekey="bla,bla,bla"></div>
<input type="button" value="CADASTRAR" onclick="submitForm()">

function submitForm() {
  if( $('#captcha').val() == $('.g-recaptcha').attr('data-sitekey') ) {
    $.ajax{
        url: 'comentarios/add_comment.php',
        type: 'POST',
        data: {
            email: $('#email').val()
        },
        success: function( retornoPHP ) {
            alert('enviou');
        }
    }
  } else {
      alert('o captcha está incorreto');
  }
}
0

Fazendo dessa maneira dará certo:

Primeiro chamamos a função salvar enviando o formulário.

$('#btn_salvar').click(function() {
            salvar($("#form_salvar")[0]);
        });

Segundo recebemos o formulário e enviamos desse modo:

function salvar(form) {
    $.ajax({
        url: "sua url aqui",
        method: 'POST',
        data: new FormData(form),
        contentType: false,
        cache: false,
        processData: false,
        success: function(data) {
            if (data.data) {
                location.reload();
            } else {
                console.log('falha ao enviar para o banco');
            }
        },
        error: function() {
            location.reload();
            console.log('alguma coisa deu errado no servidor..')
        }
    })
}

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .