Mixed Type Repeater

  • Published on Aug 14, 2024
  • 5 minute(s) read
Prev Next

Overview

The Mixed Type Repeater control creates a data repeater capable of  dynamically displaying multiple data types based on user's input. Users can also display different custom data types or primitive data types.

A common use case for the Mixed Type repeater may involve creating dynamic surveys. When creating a survey, users can use the mixed type repeater to populate different survey questions like a radio button list, true or false question, or multiple-choice question.

Example

The following example allows the end user to select a custom drop-down list repeater or a text data repeater by selecting a Button. These data repeaters will be hosted within a Mixed Type Data Repeater.

An 'Add to List' event Button adds elements to the drop-down list.

Relevant Example Lab to Follow

Please refer to our Creating a Mixed Type Data Repeater Example Lab to review and download the project.

For help importing the file, refer to our Importing and Exporting Projects article.

  1. In the Project, create a Defined Data Structure named 'Text_Element' with the following data fields: Data (String) and Name (String). Save the Data Structure.
  2. Create a second Defined Data Structure named 'Dropdown_Element' with the following String data fields: List, Data, Name. Click the Is List checkbox next to the List data member. Then, click SAVE. 
  3. Create a third and final Defined Data Structure, name it 'Element'. Configure the Structure to have two String data fields: Data and Name. Save and exit.
  4. Create a Flow and open it in the Flow Designer. Add a Show Form step to the Flow Designer to create a new Form.
  5. Configure the Form to have the following controls and Data Names mirroring the below screenshot.
    Form ControlLocation in ToolboxData Name
    ButtonActionsDone
    Text BoxDataName
    Event ButtonActions > EventsAdd Text Element
    Event ButtonActions > EventsAdd Dropdown Element
    Text BoxDataAdd To List Text
    Event ButtonActions > EventsAdd To List
    List BoxDataList
    Mixed Type RepeaterUser ControlsElements
  6. Select the Mixed Type Repeater Control. In the Data Name text box under COMMON PROPERTIES, type "Elements".
  7. Click ADD under Sources and select PICK OR CREATE SOURCE to create a new User Defined Control.
  8. When the Form Designer opens, select SETUP INPUT DATA. In the Name field, enter 'Dropdown User Control List'. Click the Type field drop-down list, navigate to User Defined Types > Defined Data Structures, and select Dropdown_Element.
    Click Save and then close the window.
  9. On the Data panel, expand DROPDOWN_ELEMENT. Click and drag the Name field to the Form and select Label Of Data Value on the pop-up menu. Then, press Enter to save control. 
  10. Drag and drop a Drop Down List control to the Form under the Label in the Toolbox panel. Under its Properties panel, change Type to String [Text].
    Expand the List Input Source drop-down and select DataName. Under List Items DataName field, click PICK FROM DATA. Select Dropdown_Element.List.
  11. Save and close Source Form Designer. Then, select OK on the Add Sources dialog window. 
  12. Add a new Source named 'Text User Control List'. It will automatically open in the Source Form Designer.
  13. When the Form Designer opens, select SETUP INPUT DATA. Enter a field named "Element" with a Type matching the Element Defined Data Structure. Click Save and then close the window.
  14. On the Data panel, expand ELEMENT. Click and drag the Name field to the Form and select Label Of Data Value on the pop-up menu. Then, press Enter to save control.
  15. In the Toolbox panel, drag a Text Box control to the Form under the Label. Change its Data Name by selecting PICK FROM DATA. Select Element.Data.
  16. Click Save and close Form Designer. Then, click OK on the Add Sources dialog window.
  17. Select SETUP INPUT DATA on the Form, add Elements (Object-List), Name (String), List (String-List), and Item (String).

Drop Down Active Form Flow

  1. Click the workspace around the Form. In the Properties panel, scroll down to the FORM RULES > Active Form Flows, select ADD.
  2.  Name the Flow "Add Drop Down Element" and Select EDIT RULE FLOW.
  3. Add a Create Data step on the Start step's outcome path. In the properties of the Create Data step, navigate to DATA > Data to Create, select Show Editor.
  4. Name this DropdownItem with the data type Dropdown_Element.
  5. Choose Build Data as the mapping type on the Create Data step Inputs. For List, select Form Input Data > List. For Name, select Form Input Data > Name.
  6. Add a Set Control Value step on the Create Data step's outcome path. 
  7. In the Set Control Value step Properties, navigate to Inputs, and select Form Data > Elements for Form Control. 
  8. Under Elements, select Join Arrays as the mapping type. 
  9. For Item 0, select Form Input Data > Elements; for Item 1, select Build Array as the mapping type; then, for Item 0, choose DropdownItem.
  10. Save and close the Flow. In the Edit Active Form Flows dialog, under ADVANCED > Triggers, choose EventButton_Dropdown: Click.
  11. Select OK to save.

Text Element Active Form Flow

  1. Click the workspace around the Form. In the Properties panel, scroll down to the FORM RULES > Active Form Flows, and select ADD NEW.
  2. Name the Flow "Add Text Element". Under ADVANCED > Triggers, choose EventButton_Text: Click. Select EDIT RULE FLOW.
  3. Add a Create Data step on the Start step's outcome path. 
  4. In the properties of the Create Data step, navigate to DATA > Data to Create, and select Show Editor. Name this TextElement with the data type Text_Element.
  5. Choose Build Data as the mapping type on the Create Data step Inputs. For Name, select Form Data > Name Textbox > Value.
  6. Add a Set Control Value step on the Create Data step's outcome path. 
  7. In the Set Control Value step Properties, navigate to Inputs, select Form Data > User Control List Container for the Form Control. 
  8. Under Elements, select Join Arrays as the mapping type.
    For Item 0, select Form Input Data > Elements; for Item 1, select Build Array as the mapping type; then, for Item 0, choose TextElement.
  9. Save and close the Flow. Select Ok back in the Active Form Flows window to confirm creation.

Add to List Active Form Flow

  1. Click the workspace around the Form. In the Properties panel, scroll down to the FORM RULES > Active Form Flows, select ADD NEW. 
  2. Name the Flow "Add to List". Under Advanced > Triggers, expand EventButton_Add_List and enable Click. Select EDIT RULE FLOW.
  3. Add an Add Item to List step on the Start step's outcome path. 
  4. In the Add Item to List step properties, navigate to Inputs; under New Item, choose Select From Flow as the mapping type and select Form Data > Add to List Text Box > Value. 
  5. Select Form Input Data > List from the Select from Flow option for Original List. Under Outputs, change the value of New List to Form Input Data > List.
  6. On the outcome path of the Add Item to List step, add a Set Control Value step. 
  7. In the Set Control Value step Properties, navigate to Inputs, select Form Data > Simple List for the Form Control. 
  8. Under Item Source, select Form Input Data > List.
  9. Save and close the Flow. Select OK to save the Active Form Flow.

Debug

  1. Save and close the Form Designer. Set all Form inputs from the Flow Designer to Ignore.
  2. Connect the Show Form step to the End step in the Main Flow.
  3. Select Debug and verify that the Flow works properly.