Input Choice Set
Last updated
Last updated
The Avonni Input Choice Set offers a range of customization options to cater to various form requirements. It supports multiple input types and allows for the adjustment of visual elements like labels and check positions. This flexibility makes it suitable for various applications, from simple data entry forms to complex user surveys.
To make the most of the Avonni Input Choice Set in Salesforce, it's essential to correctly set up the Data Source. The Data Source is where you decide what options will be available in your input choice set. There are three main ways to do this.
| Data Source Type | Description |
|---|---|
Manual | Manually enter the options you want to appear in your input choice set. |
Variable | Use a variable as a placeholder, which will be filled with Get Records collection you created in your flow. |
Picklist | Utilize a predefined list of choices already in Salesforce, known as a picklist field. |
The Input Choice Set component works with dependent picklists. If you pick a dependent picklist field for your second Input Choice Set, you'll see a new option called "controlling value".
In the screenshot below, the second Input Choice Set has this "controlling value" option because it's a dependent picklist. We've connected this to the "Value semi-colon separated" option from the first Input Choice Set.
The Input Choice Set component offers three types of inputs: Default, Button, and Toggle. Input Choice Set Types change how the input looks and behaves.
Here's a simple breakdown:
| Input Type | Description | |
|---|---|---|
Default | The standard look for your input fields, like regular checkboxes or radio buttons. | |
Button | Transforms your input fields to look like buttons, offering a more interactive experience. | |
Toggle | Changes your input fields into toggle switches, resembling on/off sliders. |
After you pick a type (Default, Button, or Toggle), you'll see some specific settings related to that type. These settings let you customize your input fields further so they work and look the way you want in your form.
When you select the default type for your input choice set in Salesforce, additional settings will become available for further customization. These settings allow you to tailor the input fields to meet your form requirements and design preferences better.
| Default Type Option | Description | Use Case |
|---|---|---|
Orientation | Choose the layout of your input options. |
|
Check Position | Determines where the checkmark or selection indicator is relative to the label. | Choose based on form design or preference. Left is traditional, right gives a modern feel. |
Is Multi Select | Allows users to select more than one option. | Ideal for forms needing multiple selections, like surveys or preferences. |
Required | Marks the input field as mandatory, requiring a response before form submission. | Use for essential fields in the form's purpose, such as contact details in a registration form. |
After selecting the Button type for your Input Choice Set in Salesforce, you can access various settings that enable further customization. These settings are specifically designed to modify the appearance and functionality of the Button type input fields.
| Button Type Option | Description | Use Case |
|---|---|---|
Stretch | Allows the button to expand and fill the available space. | Useful for full-width buttons for better visibility or distinct style. |
Display as Row | Aligns the buttons in a horizontal row. | Ideal for a streamlined look with side-by-side button choices. |
Show Checkmark | Adds a checkmark to the selected button option. | Provides a clear visual indication of the selected option. |
Checkmark Position | Determines where the checkmark appears on the button. | Choose based on design preferences or to match the form's layout. |
Orientation | Sets the orientation of the button inputs. (Horizontal option includes selecting the number of columns.) | Vertical for longer lists. Horizontal for a compact layout with an option to select the number of columns. |
Is Multi Select | Allows the selection of multiple button options. | Useful for forms needing multiple selections. |
Required | Marks the button input as mandatory, requiring a response before form submission. | Essential for critical input fields where a response is necessary. |
When you select the Toggle type for your Input Choice Set in Salesforce, various specific settings become available. These settings allow detailed customization of the toggle input fields to fit your form's design and functional requirements.
| Setting | Description | Options | Use Case |
|---|---|---|---|
Stretch | Allows the toggle to expand and fill the available space. | Useful for making the toggle prominent and easy to interact with. | |
Show Checkmark | Adds a checkmark to the selected toggle option. | Provides a clear visual indication of the selected option. | |
Checkmark Position | Determines where the checkmark appears on the toggle. | Left, Right | Choose based on design preference or form layout. |
Size | Adjusts the size of the toggle switch. | X-Small, Small, Medium, Large | Select size based on the importance of the toggle in the form and space availability. |
Message Toggle Active | Displays a custom message when the toggle is in the active (on) position. | Useful for providing context or additional information when the toggle is active. | |
Message Toggle Inactive | Displays a message when the toggle is in the inactive (off) position. | Offers clarification or instructions when the toggle is inactive. | |
Orientation | Sets the orientation of the toggle inputs. | Vertical, Horizontal | Vertical for longer lists. Horizontal for compact layouts, with an option to select the number of columns. |
Check Position | Specifies the position of the check element within the toggle. | Helps align the toggle's check element with other form elements. | |
Is Multi Select | Enables the selection of multiple toggle options. | Ideal for forms where multiple toggle selections are needed. | |
Required | Marks the toggle input as mandatory, requiring a response before form submission. | Essential for critical input fields where a response is necessary. |
The Avonni Input Choice Set component supports dependent picklists, allowing you to create dynamic and user-friendly flows that adapt based on prior selections.
Dependent Picklist Support: The Input Choice Set component integrates with dependent picklist fields.
Controlling Value Attribute: When you select a dependent picklist field for your Input Choice Set, a "controlling value" attribute becomes available.
Connecting to Controlling Field: The "controlling value" attribute should be connected to the "Value semi-colon separated" attribute of the Input Choice Set that represents the controlling field.
Imagine a flow designed to help users select their desired car. In the first Input Choice Set, they choose a "Car Maker" (e.g., Toyota, Honda, Ford). This acts as the controlling field.
The second Input Choice Set presents the "Car Model" options. Crucially, its "controlling value" attribute is connected to the "Value semi-colon separated" attribute of the "Car Maker" Input Choice Set.
As a result, when a user selects "Toyota" in the first step, the second Input Choice Set dynamically adjusts to display only Toyota models (e.g., Camry, Corolla, RAV4). If they switch to "Honda," the model options instantly update to reflect Honda's lineup (e.g., Civic, Accord, CR-V).
The attached images further illustrate the configuration.
By effectively utilizing dependent picklists with the Input Choice Set component, you can create intuitive user flows and maintain data integrity by presenting only valid choices at each step.
The Input Choice Set has a "Change" interaction. This allows you to set up a specific action when someone selects an option in your input choice set. It's like programming a reaction to user choices. You can choose from various interactions in the Avonni Components package to make your choice dynamic. You can find more information here to explore these options and learn how to use them.
The Input Choice Set component in Salesforce, with its "Change" interaction, offers a dynamic way to respond to user selections. Below are two practical examples of how these interactions can be effectively used in Salesforce environments, leveraging the interaction options available in the Avonni Components package:
Flow Navigation Interaction in a Customer Feedback Survey:
Scenario: Suppose you have a customer feedback survey within Salesforce.
Interaction Used: Flow Navigation.
Application: When a customer selects a specific option (e.g., expressing dissatisfaction with a service), the Flow Navigation interaction can automatically redirect them to additional questions or a different part of the survey (another screen). This allows for more detailed feedback collection based on their initial response.
Benefit: This tailored approach to survey navigation enhances the relevance and efficiency of the feedback collection process.
Show Toast Interaction in a Sales Order Form:
Scenario: Consider a sales order form used by sales representatives in Salesforce.
Interaction Used: Show Toast.
Application: When a sales representative selects a particular product or service option from the Input Choice Set, a Toast notification can appear, offering additional information or alerts related to that product (like a special offer or critical product notice).
Benefit: This immediate feedback ensures the sales representative is well-informed and can relay the most current and relevant information to the customer.
These examples demonstrate the versatility and practicality of the "Change" interaction in the Input Choice Set, showcasing how it can enhance user experience and workflow efficiency in Salesforce applications.
The Input Choice Set offers several options to style and customize its appearance. Here's a quick overview of what you can customize.
| Styling Option | Description |
|---|---|
Margin | Adjust the space around your input choice set to better fit within your form's layout. |
Size | Change the size of your input fields to be larger or smaller as needed. |
Label Style | Customize the appearance of the labels. Options include: |
> Color | Change the color of the text labels. |
> Font Size | Adjust the size of the font in the labels. |
> Font Style | Choose a different font style for the labels. |
> Font Weight | Make the font of the labels lighter or bolder. |
Option Label Line Clamp | Set a limit on the number of lines for the option labels, helping keep your form neat and consistent. |
