Mixed Type Repeater
  • 03 Jun 2022
  • 5 Minutes to read
  • Dark
    Light

Mixed Type Repeater

  • Dark
    Light

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 types of 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 between a custom dropdown list repeater or a text data repeater with the select of a Button. Both of these data repeaters will be hosted within a Mixed Type Data Repeater.

An 'Add to List' event Button is added to add 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 Designer 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. In the Flow Designer, add a Show Form step 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 dropdown list and 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. In the Toolbox panel, drag and drop a Drop Down List control to the Form under the Label. Under its Properties panel, change Type to String [Text].

    Expand the List Input Source dropdown 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 and drop 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), Item (String).


  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. On the outcome path of the Start step, add a Create Data step. 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. On the Create Data step Inputs, choose Build Data as the mapping type. For List, select Form Input Data > List. For Name, select Form Input Data > Name.

  6. On the outcome path of the Create Data step, add a Set Control Value step. 
  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. 
  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. Back 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, select ADD NEW.
  2. Name the Flow "Add Text Element". Under ADVANCED > Triggers, choose EventButton_Text: Click. Select EDIT RULE FLOW.

  3. On the outcome path of the Start step, add a Create Data step. 
  4. In the properties of the Create Data step navigate to DATA > Data to Create, select Show Editor. Name this TextElement with the data type Text_Element.
  5. On the Create Data step Inputs, choose Build Data as the mapping type. For Name, select Form Input Data > Name.
  6. On the outcome path of the Create Data step, add a Set Control Value step. 
  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. On the outcome path of the Start step, add an Add Item to List step. 
  4. In the properties of the Add Item to List step, 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. For Original List select Form Input Data >List from the Select from Flow option. 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. Back in the Main Flow connect the Show Form step to the End step.
  3. Select Debug and verify that the Flow works properly.


Was this article helpful?