DOM and New UA Norms for associated data and header cells

Problem statement / use cases

• users want easy DOM access to the associated header cells in a table from a particular data cell
• users want easy DOM access to the associated data cells in a table from a particular header cell
• Authors hand-coding HTML need visual confirmation of data/header cell associations from UAs
• implementors of specialized UAs want DOM access to data / header cell associations from a generalized UA

Proposed Solutions

Liaison with CSS WG

Encourage the CSS WG to add new pseudo-element, selector and syntax for associated table cells. The pseudo element would represent a box/frame in the document window for each set of associated header and data cells. The selector could further specify id or class selectors to restrict the pseudo-element selection to specific associated cells. Stylesheet authors could then apply outline, border, background and other properties to these pseudo-elements to enrich presentation of associated headers and data.

For example

table::association-box::hover (
           outline-width: 1px;
           background-color: green;
);

Note that a pseudo selector for associated headers may be a non-contiguous box frame since header cells can be separated from their data cells by unassociated cells.

Recommend UA provide visual feedback

UAs should deploy default stylehseets that provide some subtle hover feedback for these associations.

DOM support for associations

headingCells

attribute headingCells

Returns an HTMLCollection containing all of the heading cells associated with the receiver in a specific canonical order (e.g., all row cells starting from first until last in table order followed by all column header cells starting from first until last in table order). If cell has no associated header cells returns null.

columnHeaderCells

attribute dataCells

Returns an HTMLCollection containing all of the data cells associated with the receiver in a specific canonical order (e.g., all vertically associated data cells starting from first until last in table order followed by all horizontally associated data cells starting from first until last in table order). If cell has no associated data cells returns null.

rowHeaderCells

attribute dataCells

Returns an HTMLCollection containing all of the data cells associated with the receiver in a specific canonical order (e.g., all vertically associated data cells starting from first until last in table order followed by all horizontally associated data cells starting from first until last in table order). If cell has no associated data cells returns null.

Other possible DOM attributes

• vDataCells (only the data cells arranged vertically with the header cell)
• hDataCells (only the data cells arranged horizontally with the header cell)
• headColumnHeaderCells (only the column header cells in the table head and no associated header cells from the table body)
• bodyColumnHeaderCells (only the column header cells in the table body and no associated header cells from the table head)
• bodyRowHeaderCells (only the header cells in the table head row)
• thisBodyColumnHeaderCells (only the column header cells in the same table body and no associated header cells from the table head or any other table body)
• cellAssociations (returns a table constructed only from the associated cells; may need some more constructs to work fully)

In the case of a corner header cell, returns the entire table except the corner cell.

Read-write DOM attributes

These attributes might also be made read-write to facilitate explicit table cell associations by authoring tools.

Discussion and evaluation

Email

WG members should post feedback and other discussion to the WG’s list serve (the URI for the links below provides date information). Search on this email subject.

See also