Demo page

Select / Deselect all for example 2

Example 1: Checkboxes

Option one Option two Option three Option four

Radio buttons

Strawberry Banana Raspberry

Example 2: Buttons outside of .pat-checklist element

The buttons to select or deselect the checklist may lie outside of the .pat-checklist element. However, to avoid mismatches, the selectors then need to be disambiguated by starting with an object id. In other words, the selector needs to start with #elementId.

Option one Option two Option three Option four

Example 4: Hierarchy of Checkboxes

Clicking select all / deselect all only affects parent of buttons and its children.

Customer Experience

Airport experience and servicing A1.1 Fast Bag Drop A1.2 Self-bag tagging

2. Baggage A2.1 Special baggage procedures A2.2 Baggage Tag Format

Benefits & Recognition

1. Benefits B1.1 Star Alliance Gold check-in & Fast Bag Drop B1.2 Star Alliance Gold Track Security / Immigration

Select / Deselect all for example 2

Example 1: Checkboxes

Radio buttons

Example 2: Buttons outside of .pat-checklist element

Example 3: Toggle checkbox

Example 4: Hierarchy of Checkboxes