Repeat Auto Fit Containers

Business Background

Use repeat auto-fit containers to repeat information in a container element, for instance, a stepper element, instead of using a repeat strip. This function enables you to bring a collection of data from Salesforce to map dynamically to your container. The option gives you more flexibility to display multiple records and repeated data.

You can add conditions to suit your business needs in a few clicks with no code.

Push or get data from Salesforce in your repeat auto-fit containers.

Titan Solution

With Titan Web, you can add a repeat auto-fit container to a container element to repeat information in the stepper to suit your business needs. Add the repeat auto-fit container and configure it so that the data can be repeated vertically or horizontally in your container.

How to Video

Coming soon.

How to Guide

  1. Click the expand (+) icon next to the settings icon in Titan Web. A list of elements will show.
  2. Select the Containers option from the list.
  3. Drag-and-drop the container to the canvas.
    • In this example, a stepper container is used.
Stepper container
Stepper container
  1. Drag-and-drop the Repeat Auto Fit container to the step in the stepper container where you need the repeated information.
Repeat Auto Fit container
Repeat Auto Fit container
  1. Populate the repeat auto-fit container with other elements, for instance, input, text, or button elements.
Elements in repeat auto-fit container
Elements in repeat auto-fit container

Configure a Salesforce Get

  1. Select an element and click the element’s Gear icon.
  2. Select the Salesforce option and configure a Salesforce Get by clicking on the Configure Integrations button.
  3. Configure a Salesforce Get.
  4. Do this for all the relevant elements.
On Click Action icon
On Click Action icon
  1. Under Mapping, make sure that you map the elements in the repeat auto-fit container.
Map Salesforce fields
Map Salesforce fields

When the Salesforce Get runs, the repeat auto-fit container will be repeated for the number of records in the Get.

Configure a repeat auto-fit container interactivity

You can insert, delete or reset indices in the repeat auto-fit container using interactivity.

  1. Select the button element in the repeat auto-fit container.
  2. Click the On Click Action icon to open the On Click Action screen.
On Click Action icon
On Click Action icon
  1. Click the + icon. The Add Node screen opens.
+ icon
  1. Under Element Interactivity, click the Repeat AutoFit Interactivity option and click the Next button. The Add Node/Repeat AutoFit Interactivity screen opens.
Add Node screen
Add Node screen
  1. Use the drop-down list to select the repeat auto-fit container.
  2. Use the radio buttons to select an action:
    • None
    • Insert
    • Delete
      • Use the drop-down list to select one of the following options.
        • Field
        • Current Index
        • Static
    • Reset
  3. Click the Next button.
Add Node/Repeat AutoFit Interactivity screen
Add Node/Repeat AutoFit Interactivity screen
  1. Insert a tag if necessary and click the Insert button. The Repeat AutoFit Interactivity is added to the On Click Action screen.
On Click Action screen
On Click Action screen

Hidden Title

Need more help?