Checkbox validation problem since last updates

If you just check the checkbox, all the fields are marked with error

What error do you get?

@takayukister, this is the approach:

#1. Go to estudigrafema.com

#2. Scroll down to the contact form.

#3. All the fields (including the checkbox) are required. If you just click the checkbox, all the fields errors are marked. It’s the same behaviour if you press the submit button in the form with required fields that you leave empty, but this has not sense.

Best regards.

Required fields mean you need to input something to proceed.

Hi again @takayukister,

I’m sorry if my english is not fluent at all, but I think it’s easy to understand the problem with the new updates and checkboxes. Please, read this carefully and follow the steps to reproduce the error:

#1. Go to estudigrafema.com.

#2. Scroll down to the contact form.

#3. Click the checkbox.

I know “Required fields mean you need to input something to proceed”, but this is the problem: I’m clicking the ckeckbox, not the submit button.

Of course, I love this plugin.

Regards.

@cesasrgalway, hi I carried out a test as per your instructions.

Steps carried out:

#1. Go to estudigrafema.com.

#2. Scroll down to the contact form.

#3. Click the Nom field first and enter a name. “no errors displayed or red line on the other fields”

#4. Click the Correu electrònic field and enter an email. “no errors displayed or red lines on the other fields”

#5. Click the Missatge field and enter a message. “no errors displayed or red lines because now all the fields have an entry”

I did see an error message or red line if I clicked on a field and did not enter anything “left the field empty” and then clicked on the next field.

As far as I can tell the form is working as expected.

Kind regards.

Hi,

I try again…

The problem is when you click the checkbox with the rest of the fields empty.

Please, go to verdcel.com. In the bottom you’ll find the contact form. Just click in the checkbox (with the rest of the fields empty) and you’ll see nothing happens. That works as expected. In that web is the version 5.4.2.

If you go to estudigrafema.com and you click in the checkbox (remember, with the rest of the fields empty) you’ll see that all the fields has the red line error (even the checkbox). In that web is the version 5.6.3 version (the last one).

As I said, the problem is in contact-form-7/includes/js/index.js, because if in the last version I change it for the 5.5.6 version one (or earlier) is working fine.

Regards.

@cesasrgalway, this could be a theme or plugin conflict as well. Can you test one of WordPress default themes like Twenty Twenty, then carry out a test. Let us know what happens.

Kind regards.

@mbrsolution, I tried everything: change to Twenty Twenty and deactivate all the plugins (except, of course, CF7).

As I said, I’m pretty sure the problem is in contact-form-7/includes/js/index.js. You can try to restore this file to the 5.5.6 plugin version one and you it’s working fine. There is some kind of incompatibility with the checkbox in this file.

Regards.

Hi, there is a new version coming out. I am wondering if your issue is resolved in the new version.

https://github.com/takayukister/contact-form-7/issues?q=is%3Aopen+is%3Aissue+milestone%3A5.7

Kind regards.

Actually, this has been reported on GitHub several times, and each time, it was marked “invalid” and deemed a support issue, rather than a bug. Hopefully, the new validation changes handle this issue. Unfortunately, I lack the knowledge to determine this ??

This problem still exists in v5.6.4 ??

Yep it’s still there even in 5.7.
You simply add the space string there, which will do the trick.

<label class=”d-flex”>
[checkbox* gdpr ” “]
<span class=”pl-2”>stickabat.com</span>
</label>

https://www.stickabat.com/article/18/the-field-is-required-wordpress-plugin-issue-after-an-update

My checkboxes have values, and they’re optional. This doesn’t seem to be related to the issue in this thread, which is that clicking a checkbox triggers form validation.

Same to me. Selecting a

• Radiobox
• Checkbox
• Acceptance-Checkbox

will trigger all (required) fields ABOVE that field showing message “wpcf7-not-valid-tip”. Changed theme, same issue.
In other words: Selecting any radio- or checkbox is the same like submitting the form.

Weird issue that got me stuck on the latest developments. Finally i found a solution in another thread. Just add class “novalidate” to a <p> or <div> wrapping the checkbox shortcode. Only tested for checkboxes on my side.

More info here:
https://www.ads-software.com/support/topic/frontend-click-on-a-checkbox-field-triggers-validation/

Side note: curiously, it also works for required (need validation) checks. It doesn’t validate on click inside the wrapper, but it does on submitting. Go figure!

• This reply was modified 1 year, 10 months ago by pezflash.