Skip to Main Content

Breadcrumb

Overview: Multiple Selection

This example shows that multiple selection including the ability to select all is independent of the selection row header. Advanced configuration is used to set multiple selection and select all to true. See attribute Advanced: JavaScript Code.

Selection uses the standard keyboard modifiers to select or unselect. Holding the Shift key while clicking or moving with arrow keys will select a range of rows. Holding the Ctrl key while clicking or while moving with the arrow keys and using the Space key will select or unselect a row. Ctrl+A will select all. These keys work even when there is a selection row header.

This also shows an example of something useful that can be done with the Interactive Grid selection. When the selection changes the bar chart is updated to show the selected salaries. This is done with a dynamic action that listens for a selection change event and when the selection changes sets a hidden item to the list of selected employee numbers and refreshes the chart region. The chart series SQL query checks if the EMPNO is in the list. The hidden item is specified as a page item to submit for the chart region.

Multiple Selection

Compare Salary