I have created about 11 webforms in my website. Now I want to add recaptcha challenge in all of them.

I have installed the captcha module and recaptcha module. recaptcha is coming in all these forms. The problem is form gets submitted even if challenge is not taken. Below is yml file of a sample webform I have created

  '#type': textfield
  '#title': 'Test field'
  '#required': true
  '#type': captcha
  '#captcha_type': recaptcha/reCAPTCHA
  • Are your webforms Ajax-enabled? ReCaptcha has issues with Ajax-Forms, try disabling Ajax for your forms.
    – Hudri
    Apr 10 '18 at 13:54
  • I am having AJAX enabled forms. It is not working for other forms also.. Apr 10 '18 at 14:02
  • I dont know why client side validation can't be applied together with use AJAX in webforms @jrockowitz. I need to do many work-around to enable client side validation Apr 11 '18 at 7:35

I don't think reCAPTCHA module provides front-end validation. Have you tried performing front-end validation using reCAPTCHA API? You could try something like this:

 $('form').submit(function () {
   if (!grecaptcha.getResponse()) {
     $('<span class="red recaptcha">reCAPTCHA is invalid</span>').insertAfter('.g-recaptcha');}
  • Thanks @jay-chand for the answer. The issue mainly was because the recaptcha module was not updated. Got a temporary solution event.preventDefault(); was not working so I hide the submit button and showed a dummy button. Then, wrote client side validation and grecaptcha.getResponse() in the dummy button click. Apr 11 '18 at 7:27

If you have already created a webform then you can follow thi step

  1. Open this url /admin/structure/webform (Structure -> Webform)

  2. Click on "Build" in OPERATIONS column

  3. Click on "+Add element" button, there will be seen a list form element, you can select captcha from available element

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.