List View Selection
A widget that simplifies making a list view with single or multi-select functionality
Check boxes / Radio buttons | Highlight a row |
Features
- Can select a single object or a set of objects
- Option to have a check box, radio buttons, or highlight the row
- Ability to run an action when the selection changes
- Supports keyboard navigation
Usage
1. Domain model
You need a non-persistent page helper object that has an association with the entity that is listed in the list view.
In this case, my list view returns Vehicles
2. Nanoflow DS_ListViewContext
You need a Nanoflow that receives an object from the list view's row, adds it to a list, and returns the list.
This is required due to a technical limitation. Use a nanoflow to minimize overhead.
3a. Checkboxes / Radio buttons
Add the widget to a column of your list view content
Set the widget settings according to your domain model
Reference type Should the user be able to select an object or a list of objects
Reference The association from your non-persistent page helper to the objects being shown in the list view
Data source The Nanoflow created in step 2
3b. Highlight a row
Add the widget as the root of your list view content.
Set the widget settings according to your domain model
Reference type Should the user be able to select an object or a list of objects
Reference The association from your non-persistent page helper to the objects being shown in the list view
Data source The Nanoflow created in step 2
Dynamic class name The class name applied to the widget's child container when this row is selected.
Note: you will need to use some CSS/SCSS to make the widget's container the full height and width of the row. Remove the padding from the li and add it to the class you put for dynamic class name
Demo project
https://widgettesting105-sandbox.mxapps.io/p/advanced-listview-controls
Issues, suggestions and feature requests
https://github.com/bsgriggs/mendix-listview-selection/issues
Development and contribution
Benjamin Griggs