Google reCAPTCHA undefined index g-recaptcha-response в bootstrap modal

Question

Я просто хочу спросить, почему моя reCAPTCHA не работает, когда моя форма находится в модальном бутстрапе? Вы когда-нибудь испытывали это?

sign.php

index.php

<!-- Button trigger modal --> 
<button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal"> 
    Open form 
</button> 

<!-- Modal --> 
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> 
    <div class="modal-dialog" role="document"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
     <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
     <h4 class="modal-title" id="myModalLabel">Modal title</h4> 
     </div> 
     <div class="modal-body"> 
     <form action="sign.php" method="post"> 
      <div class="form-group"> 
       Name: 
       <input type="text" name="name" id="name"> 
      </div> 
      <div class="form-group"> 
       reCaptcha: 
       <div id="r1" class="g-recaptcha" data-sitekey="6Lc-xQUUAAAAAFc4apq1qbS_VI-ZTJHalsj5BGaa"></div> 
      </div> 
     </form> 
     </div> 
     <div class="modal-footer"> 
     <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
     <button type="button" class="btn btn-primary">Save changes</button> 
     </div> 
    </div> 
    </div> 
</div> 

..Я имеют sign.php, чтобы проверить, если рекапчи работает. Хотя он работает, если я не использую модальный, но когда я использовал модальный, проверка recaptcha (sign.php) не работает.

Answer 1

<button id="showModal" type="button">Show Modal</button> 

<div class="modal fade" id="myModal"> 
    <div class="modal-dialog"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
     <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
     <h4 class="modal-title">Modal title</h4> 
     </div> 
     <div class="modal-body"> 
     <div id="captcha"></div> 
     </div> 
     <div class="modal-footer"> 
     <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
     </div> 
    </div> 
    </div> 
</div> 

Jquery

$("#showModal").click(function() { 
    $("#myModal").modal("show"); 
    setTimeout(function() { 
     createRecaptcha(); 
    }, 100); 
}); 



function createRecaptcha() { 
    grecaptcha.render("captcha", {sitekey: "6LcgSAMTAAAAACc2C7rc6HB9ZmEX4SyB0bbAJvTG", theme: "light"}); 
} 

Пример: http://fiddle.jshell.net/emilhem/Lgovn28f/4/

Answer 2

Вы не подчиняющееся значения рекапчите к бэкэнду т.е. в PHP скрипт. Ваша кнопка отправки должна находиться внутри поля </form>, иначе ваша форма не будет отправлена.

проверка

вашего ответа на бэкэнд ---

if (isset($_POST['g-recaptcha-response'])) { 
    $response = $_POST['g-recaptcha-response']; 
    echo($response); 
} 
else { 
echo"value is not passing to the php script"; 
    } 

Надеется, что это помогает!