Listers
Different lister types allow listing and editing data with different characteristics and size.
Last updated
Core Platform
Different lister types allow listing and editing data with different characteristics and size.
Last updated
A lister is a combination of a list of records and an editor for creating, editing and deleting each record.
While it is possible to implement new lister types, Rierino already includes 5 alternatives for different use cases:
MenuLister provides a standard listing of all records with an inline editor for selected item.
This lister does not have any special configurations.
GroupedLister provides a listing of all records that are grouped under one or more levels.
This lister has the following special properties:
Group By: Json path for field(s) to group listed records by
NestedLister provides a tiered listing of lazy loaded records, using parent-child relations, with an inline editor for selected item.
This lister has the following special properties:
Parent: Json path for field(s) to nest records by
QueryTableLister is a relatively more sophisticated lister type, which allows filtering of large data sets and listing of results in a table format, with a pop-up editor for selected item.
This lister has the following special configurations:
Selectable: Whether multiple rows can be selected to take bulk actions
These configurations define details of columns displayed on a query based table lister.
Title: Title of the column
Path: Json path of the column data
Widget: Widget for displaying column values (e.g. img)
Properties: Properties to pass on to column widget (e.g. baseUrl)
Column Properties: Properties to pass on to table column object ()
A typical use case for setting a column as hidden is id columns, which are required for making a list selectable even when it is not preferred to display an id column.
These configurations define details of filters applicable for a query based table lister.
Path: Path for the filter value
Widget: Widget for displaying filter (e.g. TextFilter)
Properties: Properties to pass on to filter widget (e.g. label, shortText, width)
It is also to add a tab to query table lister, which allows switching between different sub-sets of lists easier (e.g. grouped by state). The configuration of tab filter is as follows:
Path: Path for the filter value
Option Values: List of id, name pairs for listing tabs and applying the filter value
allows building highly customized listers using handlebars template and custom events.
This lister has the following special properties:
Template: Handlebars template to render lister page.
Handlebars lister allows use of a number of custom events (such as for displaying details of a specific record. To call a custom event, the following code can be used (e.g. as an onclick call):
Where [EVENT] and applicable [PARAMS] are as follows:
select
Selects a specific record and displays its object editor
{"id": [ID to display] }
new
Creates a new record
-
refresh
Refreshes current records
-
set
Updates current state data, typically used for updating pagination or managing custom state data
{"pagination":{"pageSize": 10, "page": 2}}
filter
Applies current filters and pagination to update set of records
{"status": "A"}
BoardLister allows using kanban-style board functionality, typically used for managing tasks and status updates, allowing drag & drop functionality to move records between columns for status changes.
This lister has the following special properties:
Name, Description, Image, Tags: Path of the name, description, image and tags fields to display
Column Path: Json path for assigning records to columns
OptionList / Options: List of possible column values and labels
GanttLister allows using gantt chart style functionality, typically used for managing activities with start and end dates, allowing editing date ranges of records through drag and drop.
Thislister has the following special properties:
Name, Start Path, End Path, Type Path, Progress Path: Path for the related field to display on gantt chart
Length Unit: Scale displayed on the gantt chart (e.g. day, week, month, year)
