Show:

An extension for A.Plugin.Aria that creates and synchronizes a screen-reader-friendly caption element for the table that has sortable headers.

Constructor

TableSortable

(
  • config
)

Parameters:

  • config Object

    Object literal specifying widget configuration properties.

Methods

_afterCaptionVisibleChange

(
  • event
)
protected

Handles captionVisible events.

Parameters:

_afterSort

(
  • event
)
protected

Handles sort events from the host.

Parameters:

_getCaption

() protected

Returns a reference to the captionNode, and accomplishes necessary setup to prepare the element for screen readers.

_toggleScreenReaderClass

() protected

Toggles the screen reader CSS class.

initializer

() protected

Construction logic executed during TableSortable instantiation. Lifecycle.

syncCaption

(
  • columnName
  • ascending
)

Synchronizes the captionNode's text for screen readers with the sorted column and its sort direction.

Parameters:

  • columnName String
  • ascending Boolean

Properties

ATTRS

Object static

Configuration for TableSortable.

W3C_ATTRIBUTES

Object static

Static property used to define W3C's Supported States and Properties.

W3C_ROLES

Object static

Provided by the aui-alert module.

Defined in alloy-ui/src/aui-aria/js/aui-aria-roles.js:1

Static property used to define [W3C's Roles Model](http://www.w3.org/TR/wai- aria/roles).

Attributes

captionCss

String

The CSS class to be added to the caption element.

Default: ''

captionLive

String

The value of the 'aria-live' attribute.

Default: ''

captionNode

Node

The caption node in the table.

captionRole

String

The role for the caption element.

Default: 'alert'

captionVisible

Boolean

If the caption element is visible

Default: false

screenReaderClass

String

The class to used to hide the caption element but leave readable for screen readers.

Default: 'sr-only'

stringsSortable

Object

Object containing strings stating how the table is sorted.

Default: { asc: 'ascending', desc: 'descending', sorted: 'sorted', sortedBy: 'sorted by', notSorted: 'not sorted' }

tableNode

Node

The table node containing the columns to be sorted.