2017-03-03 3 views
2

私は動的にレンダリングされる多くのreCAPTCHAを持っています。 私はこれでレンダリングを行ってきた:、私はprocess.phpするフォームデータを提出するAJAX呼び出しを、持っているGoogle reCAPTCHA関数呼び出しでレンダリングされた複数のキャプチャをリセットする

<div class="g-recaptcha" data-sitekey="myKey"></div> 

<script src="https://www.google.com/recaptcha/api.js?onload=CaptchaCallback&render=explicit" async defer></script> 
var CaptchaCallback = function(){ 
    $('.g-recaptcha').each(function(index, el) { 
     grecaptcha.render(el, {'sitekey' : 'myKey'}); 
    }); 
}; 

そして、私はキャプチャを表示させたい場所にこれを置いフォームデータを返すカスタムエラー

$.ajax({ 
    type  : 'POST', 
    url   : 'process.php', 
    data  : $(this).serialize(), 
    dataType : 'json' 
}) 
    .done(function(data) { 
     if (! data.success) { ... 

が確認されていない場合、意図したように、それは動作しますが、彼はキャプチャを解決するために忘れてしまった場合は、今私は、検証の一環として、ユーザーにメッセージを表示したいです。

var response = grecaptcha.getResponse(); 
if(response.length == 0){ 
    $('.result').append('Captcha incorrect, please click I am not robot'); 
} 

、それが何をするん

if (! data.success) { 
     grecaptcha.reset(); 

この怒鳴るを追加キャプチャをリセットするには、次のとおりです。ユーザーが有効なすべてのフォームを完了しなかった場合はキャプチャをリセットします。

これはすべて、reCAPTCHAの最初のオカレンスでのみ機能します。 そして、現在使用されているcaptchaだけをリセットするよう何とか指示する必要があります。

私の最高の推測では、私はIDをウィジェット、および形成していない必要があるので、それは動作しません

var form = $(this); //get current form 
grecaptcha.reset(form); 

で試してみました。 私を助けることができますpls?

答えて

1

https://stackoverflow.com/a/41860070/7327467

リセットへのすべてのクレジットは

var form = $(this); //store current form 

var response = grecaptcha.getResponse(jQuery(form).find('#data-widget-id').attr('data-widget-id')); 
if(response.length == 0){ //append error to result div 
    form.find('.result').append('<div class="alert alert-danger">' + "Captcha incorrect" + '</div>'); } 

で行われ、reCAPTCHAのをリセットするために、私はこの代わりに前追加した "grecaptcha.resetを();"

grecaptcha.reset(jQuery(form).find('#data-widget-id').attr('data-widget-id')); 

これが役に立ちます。

関連する問題