1. Collections Component Guide
  2. Form checkboxes
  3. With a custom id attribute
Form checkboxes example

With a custom id attribute

Note that if an id is not given one is generated automatically. In either case, the id is applied to the parent element of the checkboxes, and each checkbox is given the same id with an incremented number at the end, e.g. the checkboxes below have ids of potatoes-0 and potatoes-1.

How it looks (preview)

What kind of potatoes do you like? Select all that apply.

How to call this example

<%= render "govuk_publishing_components/components/checkboxes", {
  name: "potatoes",
  id: "potatoes",
  heading: "What kind of potatoes do you like?",
  items: [
    {
      label: "Red",
      value: "red"
    },
    {
      label: "Green",
      value: "green"
    }
  ]
} %>