User interaction with the DataGrid

You can use the mouse and the keyboard to interact with a DataGrid component.

If the sortableColumns property and the column's sortable property are both true, clicking in a column header sorts the data based on the column's values. You can disable sorting for an individual column by setting its sortable property to false.

If the resizableColumns property is true, you can resize columns by dragging the column dividers in the header row.

Clicking in an editable cell gives focus to that cell; clicking a noneditable cell has no effect on focus. An individual cell is editable when both the DataGrid.editable and DataGridColumn.editable properties of the cell are true.

For more information, see the DataGrid and DataGridColumn classes in the ActionScript 3.0 Language and Components Reference.

When a DataGrid instance has focus either from clicking or tabbing, you can use the following keys to control it:

Key	Description
Down Arrow	When a cell is being edited, the insertion point shifts to the end of the cell's text. If a cell is not editable, the Down Arrow key handles selection as the List component does.
Up Arrow	When a cell is being edited, the insertion point shifts to the beginning of the cell's text. If a cell is not editable, the Up Arrow key handles selection as the List component does.
Shift+Up/Down Arrow	If the DataGrid is not editable and `allowMultipleSelection` is `true`, selects contiguous rows. Reversing direction with the opposite arrow deselects selected rows until you pass the starting row, at which point rows in that direction are selected.
Shift+Click	If `allowMultipleSelection` is `true`, selects all rows between selected row and current caret position (highlighted cell).
Ctrl+Click	If `allowMultipleSelection` is `true`, selects additional rows, which do not need to be contiguous.
Right Arrow	When a cell is being edited, the insertion point shifts one character to the right. If a cell is not editable, the Right Arrow key does nothing.
Left Arrow	When a cell is being edited, the insertion point shifts one character to the left. If a cell is not editable, the Left Arrow key does nothing.
Home	Selects the first row in the DataGrid.
End	Selects the last row in the DataGrid.
PageUp	Selects the first row in a page of the DataGrid. A page consists of the number of rows that the DataGrid can display without scrolling.
PageDown	Selects the last row in a page of the DataGrid. A page consists of the number of rows that the DataGrid can display without scrolling.
Return/Enter/Shift+Enter	When a cell is editable, the change is committed, and the insertion point is moved to the cell on the same column, next row (up or down, depending on the shift toggle).
Shift+Tab/Tab	If the DataGrid is editable, moves focus to the previous/next item until the end of the column is reached and then to the previous/next row until the first or last cell is reached. If the first cell is selected, Shift+Tab moves focus to the preceding control. If the last cell is selected, Tab moves focus to the next control. If the DataGrid is not editable, moves focus to the previous/next control.

You can use the DataGrid component as the foundation for numerous types of data-driven applications. You can easily display a formatted tabular view of data, but you can also use the cell renderer capabilities to build more sophisticated and editable user interface pieces. The following are practical uses for the DataGrid component:

A webmail client
Search results pages
Spreadsheet applications such as loan calculators and tax form applications

When you design an application with the DataGrid component, it is helpful to understand the design of the List component because the DataGrid class extends the SelectableList class. For more information on the SelectableList class and the List component, see the SelectableList and List classes in the ActionScript 3.0 Language and Components Reference.

When you add a DataGrid component to your application, you can make it accessible to a screen reader by adding the following lines of ActionScript code:

import fl.accessibility.DataGridAccImpl;
DataGridAccImpl.enableAccessibility();

You enable accessibility for a component only once, regardless of how many instances the component has. For more information, see Chapter 18, "Creating Accessible Content," in Using Flash.

View comments on LiveDocs