Error does not show when using django-crispy-forms

[nihaals]

If I do not fill any of the fields in my form, it shows the error text as normal, however, with the captcha field, it does not show the error text and it seems that it is not verified, as I changed the response and submitted the form and it still submitted.

[AltusBarry]

@OrangutanGaming: Hi, thanks for you interest in the project.

What you are describing makes it seem like perhaps the RECAPTCHA_PUBLIC_KEY and RECAPTCHA_PRIVATE_KEY settings values have not been specified in your project.
See: https://github.com/praekelt/django-recaptcha#local-development-and-functional-testing for more info on the test keys.
The gist of it is, if they are not specified, the reCAPTCHA can not fail.

If this is not the issue however. We will need a little more info such as; which version of this project are you using, which reCAPTCHA widget have you picked. Perhaps snippets from view code, form code and the form template as well as any captcha templates that may be overridden in your project.

[nihaals]

Sorry for doing such a poor bug report, I’ll write a minimal project and show the result, it’s possible that there’s a conflict.

I’ll make a more clear report later but I’m talking about the error messages you normally get when you leave a required field, as with my current code it lets the form get submitted without the field (checkbox) being filled but marks it as invalid.

[AltusBarry]

@OrangutanGaming: Aha, ok. Think we follow now.

That is legacy behaviour we have kept, for the time being, even with the release of version 2.0.0. The reason this is happening is: There is not an actual input field on the form for traditional html5 validation to check.

So the form will be submitted whether the checkbox is ticked or not, then get validated server side. If the checkbox is not ticked, it should however re-render the form with the This field is required. error above the captcha field. Similar to this attached image.

To remedy this we suggest adding extra JavaScript validation to the form, preventing it from submitting along with displaying a front end error message if the g-recaptcha-response value is empty.
Overriding this template: https://github.com/praekelt/django-recaptcha/blob/develop/captcha/templates/captcha/includes/js_v2_checkbox.html is probably the easiest place to do that in.

[nihaals]

Do you have an example of the view code? For some reason I do not see the error message when the page is reloaded.

Mine:

def post(self, request, *args, **kwargs):
    form = self.form(request.POST)
    if form.is_valid():
        ...
    return render(request, self.template_path, {'form': form, ...})

This loads errors like the username already taken and invalid passwords fine but does not seem to load the repcatcha error.

[AltusBarry]

@OrangutanGaming: We used the Django generic FormView, that only requires the form class, template name and the success url.

class BasicFormView(FormView)
    form_class=RecaptchaForm
    template_name="form.html"
    success_url="/admin"

and our form:

class RecaptchaForm(Form):
    emailfield = forms.EmailField()
    charfield = forms.CharField()
    captcha = fields.ReCaptchaField(
        widget=widgets.ReCaptchaV2Checkbox(
                attrs={"data-theme": "dark"},
        )
    ) 

It makes life so much easier as it extends the FormMixin and ProcessFormView. Those have a lot of conveniences built into them for working with forms.

However, the code provided seems more or less correct. What does the form in the template actually look like? The one we used to test looks like this:

<form method="post" class="Form" enctype="multipart/form-data">
    {% csrf_token %}
    {{ form.as_p }}
    <input type="submit" value="Submit" class="Button" />
</form>

If you manually added each field to your template, did you not perhaps merely miss adding the captcha widget errors?

[nihaals]

I have found the problem: django crispy forms. I'm using the crispy filter on the form and with this it does not show the error. Not too sure why this would break it, haven't found any other issues with it

[zapotocnylubos]

Hi, I have overridden template captcha/widget_v2_checkbox.html

<div class="d-none {{ widget.attrs.class }}">
</div>

{# original content #}
{% include "captcha/includes/js_v2_checkbox.html" %}
<div class="g-recaptcha"
{% for name, value in widget.attrs.items %}{% if value is not False %}
  {{ name }}{% if value is not True %}="{{ value|stringformat:'s' }}"{% endif %}{% endif %}{% endfor %}
>
</div>
{# original content end #}

form field:
captcha = ReCaptchaField()

using Bootstrap v4

[patagoniapy]

@nihaals Were you able to solve this problem with django crispy forms? I am currently having the same issue, in other words django crispy forms won't return that it is a required field.

[nihaals]

I think I ended up leaving it broken as it was fairly minor

[geoffrey-eisenbarth]

Adding the first line div as @zapotocnylubos mentioned solve the issue for me. Can we get this merged into the repo?

[geoffrey-eisenbarth]

I can also verify that @zapotocnylubos 's solution above fixes the missing error for ReCaptchaV3 + Crispy Forms.

[uxtomic]

I've managed to fix this by editing django-allauth signup template, and adding the following piece of code:

{% for error in form.captcha.errors %}
{% if error %}

Error verifying reCAPTCHA, please try again.

{% endif %} {% endfor %}

[thibaudcolas]

See also https://github.com/orgs/django-recaptcha/discussions/332#discussioncomment-7657620. There doesn’t seem to necessarily be something to change in django-recaptcha (more docs for crispy forms users perhaps?), so I’ll move this to Discussions.