List. Related Lists.

Lists and Related lists are elements that display a list of records based on some conditions.

The differences between List and Related List are listed below.

Lists:

  • You must select Source Type and Source Object for List.

  • You need to specify Conditions for List if you want to limit records shown with some criteria, otherwise all records of selected Source Object will be shown.

Related Lists:

  • Have Source Object set by system - Related Lists are generated automatically.

  • Have built-in Conditions set by System (these conditions are not shown to user) that limit Related List to records that have proper relationship field (like Lookup) look at record that is a Data Source of current form.

Adding component:

Component properties:

  • Source Type (1) - specify type of the Data Source. It can be sObject (standard or custom object record) or some other. Source Type selection also make some fields shown. See below about Source Types.

  • Source Object (2) - select Data Source. This field depends on Source Type.

  • View (3) - Adding columns to the list. This field set is available for sObject and AWS S3 Source Types.

  • Default Page Size (4) - if default 25 records per page is not enough choose new value in Default Page Size select.

  • Order By (5)- by default list is ordered by column that was added first. If you need to change that use 'Order By' picklist to choose another column. This field is available for sObject and AWS S3 Source Types.

  • Conditions (6)- specify Conditions for List to limit records shown with some criteria (10). This field is available for sObject Source Type.

    • Using these conditions will limit records in the list to active accounts with description not empty.

Values should be passed in the format of where clause of SOQL query e.g. using fields API names and SOQL operators.

  • Limit height to (7)- limit height of the component providing value in px.

  • Ignore Permissions (8) - loads all available records to the list including those that are not available due to user permissions.

  • Show Checkboxes (9) - displays checkbox next to each list item. Available for List component only.

Source Type (1) can be set as to object record (sObject), as to one of other options:

  • Apex Class

  • JSON

  • AWS S3

Apex Data Provider

Allows to populate lists with custom data collected in apex class. The needed Apex class must:

  • implement FLX_KB.KanBanInterfaces.FormBuilderApiInterface Interface

  • have 2 public methods: loadListData, loadLookupData

An example of such class is attached below:

To use Apex as Data Provider:

  • Select "Apex" in Source Type

  • Click "Settings" icon (11) and select an Apex class (in case of example above class is named FLX_KB_DataProvidersExample)

  • Add Parameters, if your class needs them (12)

Notes:

  • Columns for the list that has Apex class as Source Type are defined in this Data Provider class.

  • List paging is implemented through 'hasNext' list property. If it is set to true "Show More" link will be displayed under the list, otherwise it will be hidden. See class example attached above.

JSON

Built-in data provider allows to feed JSON data to the list. With this feature user can build list without interaction with database or using Apex code, and manipulate data that is not stored anywhere.

To use JSON as Data Provider:

  • Select "JSON" in Source Type

  • Click "Settings" icon (13) and type/paste a JSON code in popup appeared (14)

JSON code should contain the following properties:

  • OrderBy (15) - name of the column which list should be sorted by

  • Records (16) - array of columns entries (17)

    • Column entries are objects in this format: {"column_name":"column_value"}

  • Columns (18) - array of column definitions (19)

    • Column definitions are objects in this format: {"name":"column_name","label":"Column_label","sortable":true/false}

  • Actions (20) - set actions that can be executed on this List in this format: "actions":{"action_1":{},"action_2":{}}

The list from example above will look this:

AWS S3

AWS S3 is a proper service integration source object. To set it:

  • Select Config (21, it must be created before, see below)

  • Specify AWS S3 account Bucket name (22) where files and folders are

  • Optionally specify Path to particular Folder (23) in the Bucket

  • Configure Filter (24) to limit List with entries matching it

  • Select type (25) of entries to show (files, folders, all)

To work with AWS S3 account user must create correct and full configuration for AWS S3 list:

  • Open administration page

  • Go to Custom Code -> Custom Settings (26)

  • Click "KanBan Config List" setting (27) to go to proper Custom Setting Definition page (28)

  • Click "Manage" button (29) to open list of it's values (30)

  • Click "New" button (31) to create new config or "Edit" link at necessary entry (32) to edit current config.

  • Enter the following data (33):

    • Name (mandatory) to be referenced in system

    • Option1 - first AWS S3 key

    • Option2 - second AWS S3 key

    • Option3 - location provided by Amazon service

    • Value - the AWS S3 Config string as is, it must be set to make system know that it is special config for AWS S3 integration in forms

    • Other options should be empty

Other Settings

Validation rules:

  • This component has no validation rules

Events:

  • This component has no events

Conditional styles:

Actions

  • User has an ability to create new records from List/Related List component and review and edit existing records as well.

  • User can change default behavior of View, Edit, Delete and New buttons from list actions settings (34).

Here's the example of overriding the Edit option:

  • Check "Override" checkbox (35)

  • Click "Add" button (36) to configure Event settings (37)

  • add Events to handle (38)

  • Select "Navigate" form action (39) to navigate user to any other layout than the standard SF layout (default) behavior (see below).

Set up action parameters (40):

  • You can pass row values to the action using "Row" context object (41).

  • After selecting "Row" context object, choose list column value to be passed to action (42). Row Id is always available for selection, even if it was not added as the list column.

  • Click "Add Row" button (43) to set '"Name" and "Value" of parameters

  • Save settings (44)

In the example above Id of the case is passed to the form as the context object id.

Action settings:

Custom Actions

  • Select List/Related List component on the form (45), click "Add New" (46) button under "Custom Actions" field.

  • Configure custom action in opened popup "Action Settings" (47).

Button Position setting: "Header" buttons (48) will be displayed above the list, "Record" buttons (49) will be displayed as standard row actions:

Last updated