1. Finder Frontend Component Guide
  2. Date filter
  3. Aria controls
Date filter example

Aria controls

aria_controls_id adds an aria-controls attribute to each input. This makes it easier for users of assitive tech to jump from them to the part of the page they’re updating.

The aria_controls_id must be set to the ID of an element that’s on the page or it won’t be included.

How it looks (preview)

Closed

For example, 2005 or 21/11/2014
For example, 2005 or 21/11/2014

How to call this example

<%= render "components/date_filter", {
  name: "Closed",
  key: "form-key-2",
  aria_controls_id: "js-search-results-info"
} %>