Learn how to create list fields in Drupal.
We’ll cover the following:
- Create a radio button field
- Create a checkbox field
- Customizing the allowed options
Transcript
Trainer (00:00):
We’ve looked at how to create text fields and text areas. Now, I want to show you how to create a select list, checkboxes, and radio buttons using the list field. Let’s now create a product type list field where an editor can select a product type from a dropdown, checkbox, or radio button. So to do that, just click on add field. And from the add a new field drop dropdown, scroll all the way down and select list text and enter in product type into the label field, and then click on save and continue.
Trainer (00:39):
From the field settings page, we can change the allowed a number of values, which we have already covered, but we can also specify an allowed values list. This is where we put the options which will be used in the list. The first option will be course. To add that in, I will first enter in the key, which will be course, then I’ll put in a pipe, then I’ll add a label which will be upper case COURSE. The next will be downloadable, and the last will be physical. The key, which is the first option, will be the actual store value, and the second option will be the label.
Trainer (01:22):
As mentioned here, the label is optional. If we were to remove the course label and the pipe, then the key will be used for the value and the label. However, I do like to specify a label, so let’s put it back in. Once everything has been configured, click on save field settings at the bottom. And then leave the field edit page as it is, and then scroll down and click on save settings. Let’s now open up the product content form and I’ll do that in another tab. I’ll pop it to the left, and I’ll pop the manage field to the right.
Trainer (02:01):
And then if we go to add content and then product, and then scroll down, here we can see the product type below body and we can see the options which we added to the allowed values list. If you want to remove this none value, all you need to do is edit the field. Let’s jump to the right and then edit our product type. Let’s make it required, but you also have to set a default value. Let’s go ahead and select course as the default value.
Trainer (02:32):
And then if we refresh on the left, you can now see course is the default value, and then we have the two others, downloadable and physical, but we do not have the none option. Let’s now jump back to the browser on the right and then go to manage display. Let’s scroll down to the product type field. Then from the widget dropdown, we can see two widgets. Select list, which is the current widget, which is being used, and then we have checkboxes and radio buttons. Let’s go ahead and select checkboxes and radio buttons and click on save.
Trainer (03:09):
And then if we refresh the browser on the left and then scroll down, you can see that the product type now is a radio button. But how do we change it to checkboxes instead? Well, all we need to do is change the allowed number of values to a value greater than one. If we now jump to the browser on the right and scroll down to product type, you can see that this widget doesn’t have any cog wheels, so we can’t switch the widget to use either checkboxes or radio buttons.
Trainer (03:45):
Drupal will automatically switch the form element between radio buttons or checkboxes depending on the allowed number of values. Let’s go to manage fields and let’s edit product type, and then go to field settings. Let’s change this to unlimited and then click on save field settings. Let’s now refresh the browser on the left, and straight away you will see that now the product type is a list of checkboxes.
Trainer (04:16):
If we were to change the allowed number of values to let’s say two values, so let’s limit it down to two and we refresh, product type will still be checkboxes, but we couldn’t select all three options. Let’s go ahead and save this form. And if we click on save, you’ll see this error message, product type. This field can’t hold more than two values. So unless you have a specific reason, leave the allowed a number of values to unlimited if you want to use checkboxes. Let’s now go back to manage form display and let’s change the product type back to a select list.
Trainer (05:02):
But remember, the allowed number of values is still set to two. Let’s now refresh the browser on the left. Now you can see that the select list has been turned into a multi-select list, where you have to press command or control to select multiple options. I personally do not like multi-select lists. They are hard to use if you have a lot of options, and it’s very easy to unselect other items, because you can’t really see an overview of all the selected items. I personally try and avoid them.
Trainer (05:34):
If you want to allow users to select multiple values, then just use checkboxes. Let’s now go back to manage fields and let’s switch it back to a single value. And then let’s refresh the browser on the left and now it should be a select list. You’ve seen how easy it is to select widgets and change the allowed number of values on a list field. And it’s easy because the field has no content and we can change all of these settings while there’s no content. But let’s see what happens when the field has content and we want to change the allowed values list.
Trainer (06:17):
That’s the available options we can select. Let’s edit our existing product. I’ll go to content, and then I will edit the product, which we created previously. Let me scroll down and I will select downloadable as the product type, and then I’ll click on save. Let’s now edit the product type and let’s go to build settings. And if we were to try and remove downloadable and then click on say field settings, it won’t allow us to save it because the value has already been selected. You can see this error message right here, allowed values list.
Trainer (06:58):
Some values are being removed while currently in use. Let’s just refresh the page. And if we were to remove say course, for example, and click on save field settings, it will allow us to save it because we don’t have a product currently referencing it. Let’s now add this one back in. The labels, however, can be changed, and the labels are these options right here. So if we were to change the downloadable label or the course label and then click on save field settings, it’ll allow us to change it.
Trainer (07:34):
And then if we go and edit our product on the left, we can see that the label has changed. This is why I like to specify an actual label because in the future, you may want to change these options. And yes, it is hard to change the value. But even if you can change the label, then it gives you that little bit of extra flexibility. Let’s go back and edit our product type. Now, we can change the label as you’ve just seen, but we can’t change the key. If we were to try and change the downloadable key and click on save field settings, it’ll tell us that it is currently in use.
Trainer (08:12):
But we can change it on a value which isn’t in use. If we were to change the course value and click on save field settings, it’ll allow us to change it. Let’s now jump back into our field settings for one last time. Let’s clean this up. You can add in extra values to the allowed values list anytime even if content has been created. So if I was to enter in PDF as a new product type and then click on save field settings, it’ll allow me to save it. And then if we jump to the left and refresh, we should see our new option.
Trainer (08:52):
A list field is useful if you need a select list, checkbox, or radio buttons with a few options and you know the options won’t change, or they won’t change that often. Because as you saw, as soon as you have content, changing the allowed values gets tricky. I wouldn’t recommend that you use a list field if you are planning to have 10 or more values.