andrewlimaza / caldera-forms-anti-spam

Caldera Forms Anti Spam WordPress plugin. This adds Google's reCAPTCHA field to your Caldera Form.
https://wordpress.org/plugins/cf-anti-spam/
25 stars 17 forks source link

Caldera Forms Anti Spam ReCAPTCHA did not show on normal form #2

Open alucard001 opened 6 years ago

alucard001 commented 6 years ago

Hi

Here are my config

I am following the advice from Caldera Form and use the github plugin . Install and activate this plugin and add it to my caldera form.

My form is just a full page single form, no sub-form/double-triple form or else, only 1 form.

And my recaptcha is using V2. After setting it and go to preview form and real page with form, the recaptcha did not show up (nothing to display). But when I view source code the element is there, and the jQuery script is working fine.

No javascript error also. I test the latest V3(invisible) also but the same.

Can anyone please help because reCAPTCHA is definitely required. Especially for contact form.

Thank you very much in advance for your help.

Attached please find the screenshot for verifying.

001

002

andrewlimaza commented 6 years ago

Hey @alucard001,

Really sorry to hear about this issue, would you mind opening up a support thread on https://yoohooplugins.com/support/ and please feel free to include your Caldera Forms export (JSON) and I will look into this for you personally!

We are working on some issues with this plugin. Thank you so much for your patience, I truly appreciate it.

andrewlimaza commented 6 years ago

Do you have more than one form on the same page? Or displaying a Captcha elsewhere on the page? I know there is an issue displaying Captcha's more than once on the same page.

andrewlimaza commented 6 years ago

Also our latest version (on here) might fix this issue for you as we've made some adjustments to the ReCaptcha code. This code will be released during the course of this week.

globalser commented 6 years ago

Hi Andrew,

I have the same exact described issue.

Wordpress:: 4.8.3 Caldera Anti-spam: 0.1.1

The html is the same as Alucard posted. But i have Console error:

recaptchaen.js:387 Uncaught Error: reCAPTCHA placeholder element must be an element or id at Object.yr [as render] (recaptchaen.js:387) at init_recaptcha_fld_8061997_1 ((index):635) at HTMLDocument. ((index):642) at HTMLDocument.dispatch (jquery.js?ver=1.12.4:3) at HTMLDocument.r.handle (jquery.js?ver=1.12.4:3) at Object.trigger (jquery.js?ver=1.12.4:3) at Object.a.event.trigger (jquery-migrate.min.js?ver=1.4.1:2) at HTMLDocument. (jquery.js?ver=1.12.4:3) at Function.each (jquery.js?ver=1.12.4:2) at a.fn.init.each (jquery.js?ver=1.12.4:2)

I've checked online and it appears that it's caused when captcha library os loaded more then once. Do you know why?

Regards

globalser commented 6 years ago

The console errors go away if i comment any of the 2 init_recaptcha mentioned above in fields.php:

jQuery(document).on('click', '.reset_<?php echo $field_id; ?>', function(e){
                    e.preventDefault();
                    init_recaptcha_<?php echo $field_id; ?>();
                });
                init_recaptcha_<?php echo $field_id; ?>();
            });
        });
    </script>

The captcha is still not showing on the form. The HTML (i removed the sitekey from the html since i don't want it public):

<div class="">
<input required="" type="" data-field="fld_1802870" class=" form-control" id="fld_1802870_3" name="fld_1802870" value="" data-type="recaptcha" aria-required="true" aria-labelledby="fld_1802870Label">
<div id="capfld_1802870_3" class="g-recaptcha" data-sitekey=""></div>
</div>

There is only one form on the page, it's a simple contact form. If need to see this live, please provide your e-mail i will gladly send the url for you to see it yourself.

Regards

shaneonabike commented 5 years ago

We are experiencing the same issue. Oddly enough we don't have two recaptcha's but it appears that the plugin is generating two functions.

`

jQuery( function($){   |     | jQuery(document).on("cf-anti-init-recaptcha", function(){   | function init_recaptcha_fld_4885058_1(){   | var captch = $('#capfld_4885058_1');   |     | captch.empty();   | grecaptcha.render( captch[0], { "sitekey" : "6Le05ocUAAAAAMbOuzVGIrzbr3mRGR5xHou1BzjX", "theme" : "light" } );   | }   | jQuery(document).on('click', '.reset_fld_4885058_1', function(e){   | e.preventDefault();   | init_recaptcha_fld_4885058_1();   | });   |     | init_recaptcha_fld_4885058_1();   | });   | }); Githubissues.

  • Githubissues is a development platform for aggregating issues.