How to use Checkboxes and Radio Buttons on Field Widgets in Drupal

Don’t forget to subscribe to our YouTube channel to stay up-to-date.

If you create an entity reference or list field, you will notice the “Check boxes/radio buttons” widget on the “Manage form display” page.

Field widgets for radio buttons and checkboxes.

How do you switch between checkboxes or radio buttons? Because the widget has no settings to choose the form element.

Drupal automatically switches between the elements depending on the “Number of values” option on the “Field settings” page.

Create List Field

Let’s first create a list field with options.

1. Go to Structure, “Content types” and click on the “Manage fields” on a content type.

2. Click on “Add field”.

3. Select “List (text)” from “Add a new field” drop-down. Then enter Category into Label.

Click on “Save and continue”.

4. Enter the following into “Allowed values list”.

drupal|Drupal
react|React
wordpress|WordPress 

Click “Save field settings”.

5. Go to “Manage form display” and change the widget on Category to “Check boxes/radio buttons

Display Widget as Radio Buttons

If the “Allowed number of values” is set to 1, which can be changed by editing the field and clicking on “Field settings” and changing the configuration..

Then the widget will be displayed like the following:

Display Widget as Checkboxes

If you want your field widget to use checkboxes then change the “Allowed number of values” to 2:

Or instead, select Unlimited:

Then it’ll display as checkboxes:

Summary

The “Check boxes/radio buttons” widget switches between form elements based on the field’s “Allowed number of values” settings.

If you want it displayed as a radio button, limit it to 1. If you want checkboxes, change it to unlimited or limit it to 2 or above.

Frequently Asked Questions

How to add checkbox in Drupal?

Create a list or entity reference field, then change the “Allowed number of values” to unlimited or limit it to 2 or above. Make sure you select “Check boxes/radio buttons” as the field widget.

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top