Validating checkbox list placed in multiple columns
In this example, you will see how to validate a list of checkboxes which are placed in multiple columns.
The following form asks us to choose at least one day that we will be notified when the event is going to happen. The list of days are placed inside two columns which have the same
w-50 class (assuming you're using the Tachyons framework).
We need to define the elements that display the feedback icon and error message:
The checkboxes are placed in the same row, inside
.js-alert-field-container element. We need to let the Tachyons plugin know how it can find these fields:
To show the feedback icon at the element
#alertDayIcon, we need to use onPlaced option which is called when the icon element is inserted to the document:
The last step is to indicate the container where the associated messages are shown:
Look at the Showing messages in custom area section for more details.