RadListView Item Selection

RadListView implements a mechanism for selecting or deselecting items. When using the selection mechanism, two selection modes are available:

• Single selection
• Multiple selection

RadListView also exposes convenient API for programmatically selecting or deselecting items and acquiring the currently selected items. The following methods are exposed by RadListView to manage selection:

• selectAll() - selects all available items in the data source
• deselectAll() - deselects all currently selected items from the data source
• selectItemAt(index) - selects the item at the specified index
• deselectItemAt(index) - deselects the item at the specified index if selected
• isItemSelected(item) - determines whether the provided item is selected
• getSelectedItems() - returns an array of the items currently selected

Enabling Selection in RadListView

The value of the selectionBehavior property determines how the item selection works. It accepts the values from the ListViewSelectionBehavior enumeration:

• None - items cannot be selected
• Press - items are selected by tapping on them
• LongPress - items are selected by holding them

Additionally, the value of the multipleSelection property determines which selection mode will be used. The available options are:

• multiple selection mode - allows for selecting multiple items. RadListView keeps track of which items are selected and exposes them through a getSelectedItems() method. Multiple selection is enabled by setting the multipleSelection property to true.
• single selection mode - only one item can be selected at a time. This mode is enabled by setting the multipleSelection property to false.

Example 1: Enabling multiple selection on RadListView in XML:

<lv:RadListView id="listView" items="{{ dataItems }}" row="1" selectionBehavior="Press" multipleSelection="true">

Handling Selection Events

To notify you when the selection state of an item is changed, RadListView exposes the following events:

• itemSelecting - fired before an item is selected. Can be used to cancel the operation
• itemSelected - fired after an item is successfully selected. At this point the item is already in the selected items array returned by the getSelectedItems() method
• itemDeselecting - fired before an item is deselected. Can be used to cancel the operation
• itemDeselected - fired after an item has been successfully deselected. At this point the item is not part of the selected items array returned by the getSelectedItems() method.

References

Want to see this scenario in action? Check our SDK examples repo on GitHub. You will find this and many other practical examples with NativeScript UI.

• Selection Example