The Avonni Input Choice Set offers highly customizable input options for forms, supporting various input types and visual adjustments.
Last updated
Was this helpful?
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.
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:
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.
Orientation
Choose the layout of your input options.
Vertical for longer lists or ample space.
Horizontal for compact forms or limited space. If selected, options to set the columns will be available.
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.
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.
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.
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.
.avif?alt=media&token=26ca91a5-bf73-4301-9d21-760f69778e3f)
