A Grid is a control that is used to display or modify data in a tabular form. Depending on the context it is used in a grid can offer sophisticated functions for sorting, filtering and ordering data. Besides the grids content that is shown in rows and columns the grid can show following optional components: a grouping area (figure 1:1), column headers (figure 1:2), expander button (figure 1: 4) and expander regions (figure 1:5) and a split bar (figure 1: 6) .
Figure 1: Example of a grid control.
The Grouping area is used to group the displayed data by the values of one or more columns. Drag the header of the column you want to group by into the grouping area to define the grouping criteria. You can group by any number of columns. When grouped you can click on the grouping element in the grouping area to change the sorting of the grouping.
The column headers give the displayed column a name and can be used to sort by that column and to filter the displayed data by this column. Click on the column header to change sorting, click on the funnel symbol to open up the filtering dialogue. Column sizes can be changed by dragging the borders of a column header.
Expanders can be used to display or hide detail information about a single row.
The Split bar can be used to split the grid vertically. Both sub grids will show the same data but the horizontal scroll bar only applies to the right sub grid.
The grid can allow the selection of multiple rows. If so you can use the Keyboard and Mouse to select multiple rows, see table 1 for a description.
Task |
Steps |
Select multiple consecutive rows |
Select first row, hold Shift and select last row with mouse click Select first row, hold Shift and use Up-Arrow or Down-Arrow |
Select all rows |
Crtl + A |
Remove some some rows from selection |
Ctrl + Left Click on selected row |
Select multiple non consecutive elements Add rows to selection |
Ctrl + Left Click on unselected row |
Select all elements up |
Crtl + Shift + Up Arrow |
Select all elements down |
Crtl + Shift + Down Arrow |
Table 1: Selection of multiple elements in a grid with multi-select is enabled