This article describes the list builder component and its properties.
The list builder allows the user to choose none, one or more items from a pre-defined list of items. In the example below Mar and Apr have been selected from the list Jan, Feb, Mar, Apr, May, Jun.
Select List Builder from the controls category of the component library. Move the mouse over the canvas and click to add a dropdown component to your project:
List Builder Properties
The list builder properties consist of GENERAL, DATA INSERTION and DYNAMIC VISIBILITY drawers. This guide will describe the general and data insertion properties only; the dynamic visibility properties are generic to each component and a separate guide and tutorial on dynamic visibility can be found here.
The component properties are set and edited using different methods, some have multiple methods, some just one. See this Set property values article for more information on using the different methods.
- Source items – This property can only be set by binding to a range of cells in the spreadsheet. The content of those cells provide the list on the left hand side of the list builder which provide the items from which the user can choose.
- Pre-Selected Destination Items – This property can only be set by binding to a range of cells in the spreadsheet. The content of those cells specify the items from the source items which will be pre-selected in the righthand list. Items in this list which do not appear in the source items list are ignored
- Show Filters – This property determines whether search boxes are shown at the top of the two lists.
- Source Title – This property sets the title above the source item list
- DestinationTitle – This property sets the title above the destination item list
Data insertion is triggered when a selection is made by the user. Data insertion is one of the core concepts within Squirrel, if you aren’t sure what it is, take a look at the Getting Started: Data Insertion tutorial for more information.
- Series – This property lists all of the Series for the component. Add a new series by clicking on the plus button above the property field. Delete a series by selecting it and then clicking the trash icon.
- Name – Rename the series if you wish by editing the name within the property field or by binding the name property to a cell in the spreadsheet. In both cases the name of the series in the Series property field will update accordingly.
- Type – Choose a data insertion type from the drop down box. For more information about the types, take a look at Series Data Insertion in the Step-by-Step section of this article on Data Insertion.
- Source – If the Type selected is “row” or “column”, this property will become enabled. Bind to a cell or range of cells in the spreadsheet that will supply the source data. This range should contain as many rows or columns as the source list has items. For each item selected by the user a row or column from the source will be inserted into the destination range.
- Destination – Bind to a range of cells where the data will be inserted. This range should have as many rows (or columns in the case where the type is “columns”) as the source item list. For each item selected to the destination list, the list builder will insert the value, position, row or column into the destination. These will be inserted in the order they appear in the destination list.