Grids with Multiple Selection in Smart Devices

Your application has one or more actions that may be applied to one or more selected items in a grid. GeneXus lets you scan all selected items in a Grid with the "for each selected line" command. The code to execute an action on all selected items will look as follows.

for each selected line in <GridName>
     <call_to_proc>
endfor

User Interface

The behavior of the user interface for item selection can change depending on the "Show Selector" property of the Grid.

There are two ways of interaction:

  1. The selector is visible in the Grid, and you select the rows first and after you execute the action
  2. The selector becomes visible when you select the action, then you select the rows and after you confirm the action execution.

The "Show Selector" grid property lets you model the above. It has the following values:

Always The selector is always shown if there is at least one action with a "for each selected line" over the Grid.
On Action The selector is shown if an action having a "for each selected line" command over this Grid is executed.
Platform Default Depending on the platform (iOS, Android, BlackBerry), this value implies that:
• When executing in iOS, the behavior of On Action value is assumed.
• When executing in Android or BlackBerry, the behavior of Always value is assumed.

 

Using Multiple Selection

To further explain the use of multiple selection actions, we will use the example of a KB.

Steps:

1. In the grid from the List section of WorkWithDevicesCustomer, we will set the following properties:

  • Default Action = <default>. This allows see the Detail section of the WorkWithDevicesCustomer when you tap in a register.
  • Show Selector: Always. See User Interface section of this document.

See the image below:

multipleSelectionGridProps

2. Create a new action called "UpdateAddress" (right click on the Application Bar --> Insert Action). This action will call a procedure "updateAddress". Basically, the procedure will update the CustomerAddress attribute of the selected items.

In this procedure, we have to program the following code:

for each
     CustomerAddress = "TestMS"
endfor

The procedure has a parm rule as the following:

Parm(in:CustomerId);

Note: Every parameter must be an input parameter.

3. Finally, we have to program the Event associated with the UpdateAddress action created before:

Event 'UpdateAddress'
     Composite
          For each selected line in Grid1
               updateAddress.Call(CustomerId)
          Endfor
          // refresh
          SDActions.Refresh()
     EndComposite
EndEvent

See the image below:

multipleSelectionActionEvent

For grids based on SDT´s, the way to access to each item is CurrentItem.

Example

For each selected line
    updateAddress.Call(&Customer.CurrentItem.CustomerId)
Endfor

Where &Customer is a variable based on the BC.

On the device

1. We have to select the items that we would like to update. The items can be selected clicking in the checkbox.

See the image below:

multipleSelectionEmulator1

2. Go to the menu and run the updateAddress action. When button is tapped, the procedure associated with the action will be executed.

See the image below:

multipleSelectionEmulator2

3. After the refresh of the device, we can see the address changed correctly:

multipleSelectionEmulator3.

The following image is the execution on the iPad device:

multipleSelectionIPad.

Considerations using Android

In Android, we have different implementations depending on the platform:

  • Honeycomb (3.0) or greater: based on http://developer.android.com/design/patterns/selection.html. Long press or check boxes to start the selection, tap on each item to add/remove to the selection. Contextual Application Bar to execute the actions.
  • 2.x: Check/Uncheck with the check boxes to add/remove items to the selection. The action to be executed must be present on the screen or the Application Bar.

Notes

  • If you have an action with several for each selected line over different Grids, the behavior of the User Interface is the platform default.
  • An attribute used in a "for each selected line" command, must be present in the grid on the form to works correctly.
  • In the "for each selected line in <grid>" command, the grid's name is optional when you have only one grid in the WorkWith for SD.
  • If the grid row class of the theme has highlighted background color, this color will be used to mark the selected items.