• Product

    Document Studio

    Generate, Sign, and Automate Salesforce documents with real-time sync

    Document Generation eSign Files CLM

    Experience Studio

    Build portals, apps, and forms directly in Salesforce with Dynamic data flow and adaptability

    Forms Flows Portals Surveys

    Go Unlimited

    Portals & Web Apps
    High-Volume Doc Gen
    Forms & Synced Surveys
    eSign & Contract Lifecycle
    Enterprise Compliance
    All-in-One Suite
    Book a demo
  • Solutions
    Financial Services

    KYC, mortgages, and compliance
    Healthcare

    HIPAA patient intake and portals
    Education

    Admissions and FAFSA automation
    Nonprofit

    Donors, grants, and workflows

    Legal

    Intake, contracts, and approvals
    Insurance

    Quoting, claims, and renewals 

    Go Unlimited

    Portals & Web Apps
    High-Volume Doc Gen
    Forms & Synced Surveys
    eSign & Contract Lifecycle
    Enterprise Compliance
    All-in-One Suite
    Book a demo
Log In Slack sales

Titan Support

How can we help you?

Platform

Quantity Counter Buttons

Business Background

The Buttons option is available for the Quantity Counter element. You can configure the counters as buttons and/or icons.

You can add a Trash button with on-click actions.

How to Guide

  1. Click the + icon to open the list of elements.
  2. Select the Survey option from the list.
  3. Drag-and-drop the Quantity Counter element to the canvas.
  4. Click the Quantity Counter settings Gear icon. The Quantity Counter setting screen opens.
  5. Select the Interactivity option from the list.
  6. Click the Gear icon next to the Button option. The Counter Button screen opens.
Button Gear icon
Button Gear icon
Note:

The – and + icons are default. You can change these to any icon you need.

This image has an empty alt attribute; its file name is image-137.png

  1. Configure the following:

Decrement and Increment

  1. Add text to the Decrement and Increment options if needed.
    • Text: this is the text that will be shown on the counter.
    • Aria Label: this is the label that is used by assistive technologies to describe the element.
      • Aria (Accessible Rich Internet Applications) is a set of attributes that can be added to HTML elements to provide additional information to assistive technologies, such as screen readers. This helps make web content more usable and understandable for users with various disabilities.
Counter Button screen
Counter Button screen
  1. If necessary, change the default icons for Decrement and Increment by an icon clicking the Select from Library button. The Select icon screen opens.
    • The Use Icon option is enabled by default.
    • Use the toggle switch to disable the option.
Counter Button screen
Counter Button screen
  1. Configure any icons for the Decrement and Increment.
  2. Click the Apply button.
Select icon screen
Select icon screen
Note:

You can add text with the default icons.

  1. If required, use the toggle switch to disable the icons so that only the button text appears. You must configure button text when the icons are disabled.
Counter Button screen - Decrement
Counter Button screen – Decrement

The following are examples:

Examples
Examples

Trash

  1. Click the Trash option.
  2. Use the toggle switch to enable the Trash Button.
  3. Click the Configure button to configure the On Click action. The On Trash button click screen opens.
Counter Button screen - Trash button
Counter Button screen – Trash button
  1. Use the + icon next to Start. The Add Node screen opens.
On Trash button click screen
On Trash button click screen
Note:

Build a process that will be triggered upon clicking on the element.

You have different options on the Add Node screen, for instance, Salesforce Action, Document Generation, Send Emails, Redirect/Go to Page, Show messages, and more.

You can configure an Affected Elements action to reset the value of the quantity counter.

Add Node screen

  1. Add text to the Trash button if needed.
    • Text: this is the text that will be shown on the counter.
    • Aria Label: this is the label that is used by assistive technologies to describe the element.
Counter Button screen
Counter Button screen
  1. Use the Use Icon toggle switch to use an icon.
  2. Click the Select from Library button.
Counter Button screen
Counter Button screen
  1. Configure any icons for the Trash button.
  2. Click the Apply button.
Select icon screen
Select icon screen
  1. Use the toggle switch to enable the icon’s absolute position. The Offset field opens.
  2. Type a value in the offset field.
    • “Offset” refers to the positioning of the icon relative to the quantity counter element.
    • You can use positive or negative numbers.
  3. Use the drop-down list to select the position of the icon. The options are as follows:
    • Left
    • Right
  4. Click the Apply button.
  1. Save and preview the project.
Examples
Examples

The Only Forms Solution Built 100% in Salesforce.

Slack an expert