Form checkboxes example

Checkboxes with data attributes and custom uncheck event category

Data attributes for tracking can be applied as shown. Custom JavaScript in the component will fire different tracking events on check and uncheck.

How it looks (preview)

How to call this example

<%= render "govuk_publishing_components/components/checkboxes", {
  name: "With tracking and a custom uncheck category",
  items: [
    {
      label: "Tracked",
      value: "tracked",
      data_attributes: {
        track_category: "checkboxClicked",
        untrack_category: "checkboxUnchecked",
        track_label: "/news-and-communications",
        track_action: "news",
        track_options: {
          dimension28: 2,
          dimension29: "Tracked"
        }
      }
    }
  ]
} %>