By default when using the Checkbox form field, you can select as many options as you’d like. But you have to select them manually. Giving the option to bulk select all of the options in your Checkbox can save time to complete your form.
1) Setting up the form
First, you’ll need to set up your form and add the Checkbox form field to your form with all your options. Please know that where ever you place the option to bulk select everything has no bearing on the setup itself.
Finally, the last step is to add the code to your site.
In the above code snippet, you’ll notice the
#wpforms-793-field_1_1. This part of the code will need to be updated to match not only for your form ID but also your field ID of the Checkbox field as well as the option number that the Select All option is with regards to what number it was when you added in the options.
Let’s break down that line of code to show you what each number represents.
#wpforms-793. The 793 represents our form ID.
-field_1. The 1 represents our field ID.
_1. The final number is the where the Select All option appears in our list. If you added it as the first option – it will always be 1. If you added 20 options to your Checkbox and made the Select All option the last option, this number would be 20.
If you need help locating your form or field ID, please review this tutorial.
Now you’re visitors have an easy bulk all option on your form.
Would you like to use images for your Checkbox options? Take a look at our tutorial on How to Apply Images to Checkbox Labels Using CSS.
Q: Can I use this script when using Image Choices for my Checkbox field?
A: Absolutely! This will work for both image and non-image Checkbox form fields.
Q: How can I add a “deselect all” option?
A: If you only want to add an option that does a bulk deselect of any option already selected, simply add an option to your form that would specify this such as Deselect or None.
Once you’ve saved your form, you can then add this code to your site.
Just remember to change the
#wpforms-1115-field_18_4 to match what your form ID, field ID and option number is from your form. Our form ID is
#wpforms-1115, the field ID is
-field_18 and finally the option number for the deselection is