I have a webform that I want to add a reCaptcha to. So far I've done everything properly, the webform will display a recaptcha box below the form when viewing the node form. I have a modal window webform (thats similar to an opt-in form), that uses ajax to grab the specific webform and display it as a block in the window. Now the issue is that the reCaptcha does not display below the form.
I've tried replacing the recaptcha with a math challenge captcha, and it would display properly on both the webform and modal window.
The good news is that the ajax webform shows an instance of the captcha when you look at the html.
<div class="captcha"><input type="hidden" name="captcha_sid" value="561"> <input type="hidden" name="captcha_token" value="4bbbf337ec22df5fe3befde6f601601d"> <input type="hidden" name="captcha_response" value="Google no captcha"> //g-recaptcha is where the captcha is supposed to be rendered, however it is empty <div class="g-recaptcha" data-sitekey="6Ld1XSMUAAAAABJRpsnwwzlV7_yceyWERRWnCYgc" data-theme="light" data-type="image"></div></div>
I've been stuck on this issue for almost a week. Is there suggestions or approach that I should take?