Input Choice Set Grid

The Avonni Input Choice Set Grid presents choices in an organized grid, simplifying selection in forms and data entry.

---

How It Works

The Input Choice Set Grid functions similarly to a spreadsheet and consists of three main elements: columns, rows, and values.

Columns

Columns represent the choices or criteria available to the user and are displayed in the top row of the grid. You can populate columns using various methods:

• Manual Entry: Directly type in the options.

• Flow Variables: Use values from your flow variables.

• Picklist Fields: Pull options from a picklist field on a Salesforce object.

• Salesforce Data Query: Fetch options directly from your Salesforce data using a query.

Rows

Rows are created manually and represent different items, records, or categories that users can select. Each row provides context for the options in the columns.

Values

Each cell in the grid, formed by the intersection of a row and a column, holds a specific value. You can assign a value to each cell, and when a user selects that cell during the flow, the assigned value is stored. This setup allows for precise data capture based on user interactions within the flow.

Capturing User Selections

To capture user selections in your flow:

• Attributes to Use:

  • value: Stores the selected cell's value if a single selection is enabled.

  • valueSerialized: Stores all selected values in a serialized format for multiple selections.

• Usage:

  • Reference these attributes in subsequent steps of your flow.

  • Use the captured data to create or update records, make decisions, or trigger actions.

No additional configuration is needed within the grid component to capture these values; they are inherently available after the user interacts with the grid

Common Uses

• Prefilling Values: When the component loads, prepopulate the grid with default selections to guide users or streamline data entry.

• Data Collection: Organize complex data inputs, such as schedules, resource allocations, or preference mappings.

• Surveys and Feedback: Gather user feedback across multiple criteria efficiently

Styling Options

Input Choice Set Grids provide a user-friendly way to gather multiple selections in a structured format. We offer a range of styling options to ensure your grid integrates seamlessly with your application's design.

Layout and Dimensions

• Margin: Control the spacing around the grid to position it correctly within its surrounding elements.

• Size: Adjust the overall size of the grid container to fit your layout requirements

Grid Appearance

• Grid Background: Customize the background color of the entire grid container.

• Grid Border: Add a border around the grid to provide visual definition. You can customize the border's style (solid, dashed, etc.), color, and thickness

Labels and Headings

• Label: Style the main label or title that appears above the grid. Adjust the font, size, color, and weight to clearly identify the grid's purpose.

• Columns Label: Customize the appearance of the labels that identify each column in the grid.

• Rows Label: Customize the appearance of the labels that identify each row in the grid

Input Cell Customization

Input: Style the individual input cells within the grid. This includes options for:

• Background: Set the background color of the cells.

• Border: Add or customize borders around the cells.

• Text: Style the text within the cells, including font, size, and color. You can also customize the appearance of selected or unselected cells

Enhanced User Experience

By utilizing these styling options, you can create Input Choice Set Grids that are functional, easy to use, visually appealing, and consistent with your application's overall design. This enhances the user experience by providing a clear and organized selection method.