LogoLogo
HomepageYouTube ChannelInstall from the AppExchange
  • Home
  • Dynamic Components
  • Flow Components
  • Experience Components
  • Projects
  • 👋Welcome
  • Getting Started
    • Product Tour
    • Quickstart Tutorial
    • Understanding The Essentials
      • Component Builder
      • Component Visibility
      • Target Page Object
      • Using Variables and Component Data
      • Publishing your Dynamic Components
      • Dynamic vs. Flow Components
    • Avonni Components App
      • Accessing the App
      • Folders
      • Templates
      • Version management
    • AppExchange Listing Page
    • Installation & Licenses Management
  • Tutorials
    • Projects
    • Components
      • Calendar
        • How to Create Events Quickly by Dragging
        • How to Add an Edit Action to Calendar Events
        • How to Add a New Event Button to the Calendar Header
        • How to Customize the Right-Click Menu
        • How to Reschedule Events with Drag and Drop
      • Columns
        • Creating a Responsive 3-Column Layout
      • Data Table
        • How to customize Data Table style
        • How to make a field editable
        • How to add clickable buttons
        • How to color-code badges
        • How to export data
        • How to configure search
        • How to set columns visibility
      • Kanban
        • Saving Changes on Drag-and-Drop
      • List
      • Metric
      • Record Detail
        • Saving Changes
    • Interactions
      • How to create an interaction to navigate to an object page
      • How to create an interaction to navigate to a record page
      • How to Pass Multiple Selected Records from a Dynamic Component to a Screen Flow
    • Reactive Components
      • Reactive Map and Data Table
      • Master-Detail Relationship with Data Tables
      • Vertical Tabs with Reactive Data Table
    • Style
      • How do you add space or a break between sections or fields?
    • Tips and Tricks
      • Using the Dynamic Component component
  • Component Builder
    • Overview
    • Configuring Components
      • Properties
      • Fields
      • Style
    • Data & Interactions
      • Data Sources
        • Manual
        • Picklist
      • Resources
        • Constant
        • Formula
        • Nested Queries
        • Query
        • Variable
      • Interactions
        • CRUD from Record Variable
        • Download
        • Execute Flow
        • Navigate
        • On Load
        • Open Alert Modal
        • Open Confirm
        • Open Dynamic Component Dialog
        • Open Dynamic Component Panel
        • Open Flow Panel
        • Open Flow Dialog
        • Show Toast
    • Advanced Topics
      • Undo / Redo
      • Copy and Paste
      • Keyboard Shortcut
  • Components
    • Explore All Components
    • Accordion
    • Alert
    • Audio Player
    • Avatar
    • Avatar Group
    • Badge
    • Barcode
    • Blockquote
    • Button
    • Button Group
    • Button Icon
    • Button Menu
    • Button Stateful
    • Calendar
    • Camera 🆕
    • Card
    • Carousel
    • Chart
    • Checkbox
    • Checkbox Button
    • Chip Container
    • Color Picker
    • Columns
    • Combobox
    • Container
    • Counter
    • Data LWC Container
    • Data Table
    • Date Picker
    • Date
    • Date Range
    • Dual Listbox
    • Dynamic Component
    • Formatted Address
    • Formatted Name
    • Formatted Value
    • Header
    • Icon
    • Icon Picker
    • Illustration
    • Image
    • Input Color
    • Input Date
    • Input Pen (Signature)
    • Input Text
    • Kanban
    • List
    • LWC Container
    • Map
    • Media Object
    • Metric
    • PDF Viewer
    • Pivot Table
    • Progress Bar
    • Progress Circle
    • Progress Indicator
    • Rating
    • Record Detail
    • Relationship Graph
    • Scope Notification
    • Section
    • Separator
    • Slider
    • Status
    • Tabbed Container
    • Tabs
    • Text
    • Text Area
    • Timeline
    • Toggle
    • Tree
    • Vertical Visual Picker
    • Video Player
    • Visual Picker
    • Visual Picker Link
  • Help
    • Contact Support
    • Security
    • Performance Guide
    • Deployment Process
    • Release Notes
    • Report Bugs
Powered by GitBook
LogoLogo

Company

  • About Us
  • Pricing

Policies

  • Privacy Policy
  • Terms of Service
On this page
  • Execute Flow Interaction
  • Overview
  • Supported Components
  • How it Works
  • Configuration
  • Step-by-Step Example: Updating a Contact
  • Important Considerations
  • In Summary

Was this helpful?

  1. Component Builder
  2. Data & Interactions
  3. Interactions

Execute Flow

Last updated 2 months ago

Was this helpful?

Execute Flow Interaction

The "Execute Flow" interaction lets you launch an autolaunched Salesforce Flow directly from within an Avonni Dynamic Component. This provides a powerful way to integrate automation and business logic into your user interface, without requiring users to navigate away from the current page.

Overview

The Execute Flow interaction is a way to trigger a background process (an autolaunched Flow) from a user action within a component. This is useful for automating tasks, updating records, performing calculations, or implementing any other logic in a Flow.

Supported Components

You can add the "Execute Flow" interaction to the following Avonni Dynamic Components:

  • Button

  • Button Group

  • Button Menu

  • Button Icon

  • Data Table (Header Actions and Row Actions)

  • List Item

Important Note

The "Execute Flow" interaction is designed for autolaunched Flows (Flows that run in the background). If you want to launch a Screen Flow (a Flow with user interface elements), use the "" or "" interactions instead

How it Works

  1. User Action: The user interacts with the component (e.g., clicks a button).

  2. Flow Execution: The "Execute Flow" interaction triggers the specified autolaunched Flow.

  3. Data Passing (Optional): You can pass data from the component to the Flow as input variables.

  4. Flow Processing: The Flow runs its logic, potentially using the input variables.

  5. Output (Optional): The Flow can return data as output variables.

  6. Post-Execution Actions (Optional): You can configure actions to occur after the Flow finishes (e.g., display a toast message on success or error).

Configuration

To configure the "Execute Flow" interaction:

  1. Select the Component: Choose the Avonni component (e.g., a Button) that will trigger the Flow.

  2. Add the Interaction: In the component's properties panel, find the section for configuring "Actions" or "Interactions." Add a new action and select the "Execute Flow" type.

  3. Configure the Settings:

    • Flow API Name: Select the API name of the autolaunched Flow you want to execute. This is the unique identifier of the Flow.

    • Flow Input Variables (Optional):

      • To pass data into the Flow, add entries here.

      • For each input variable:

        • Name: Enter the exact API name of the input variable as defined in your Flow.

        • Value: Select the value you want to pass. This can be:

          • A static value (e.g., "New").

          • A dynamic value from the component (e.g., the selected row's ID).

          • A resource.

    • Output Variables (Optional):

      • To capture data from the Flow, add entries here.

      • For each output variable:

        • Name: Enter the exact API name of the output variable as defined in your Flow.

        • Resource Name: Enter the resource's name in your Dynamic Component, where you can use this value.

    • On Finish (Optional): Configure an action to occur when the Flow completes successfully. An everyday use case is to display a "Show Toast" action to notify the user.

    • On Error (Optional): Configure an action to occur if the Flow encounters an error. An everyday use case is to display a "Show Toast" action to inform the user.

Step-by-Step Example: Updating a Contact

Let's say you want to create a button that, when clicked, updates a Contact's status to "Active" using an autolaunched Flow.

  1. Create the Autolaunched Flow:

    • Create a new autolaunched Flow in Salesforce Setup.

    • Add an input variable named ContactId (Text type).

    • Add a "Get Records" element to retrieve the Contact with the matching ContactId.

    • Add an "Update Records" element to update the Contact's Status field to "Active".

    • Add an output variable (Optional).

    • Activate the Flow. Note the Flow's API Name.

  2. Add a Button Component: Add an Avonni Button component to your Dynamic Component.

  3. Configure the "Execute Flow" Interaction:

    • Select the Button component.

    • Add an "Execute Flow" interaction.

    • Flow API Name: Enter the API name of your autolaunched Flow.

    • Flow Input Variables:

      • Name: ContactId

      • Value: @ThisItem.Id (This assumes your button is within a repeating component like a Data Table or List, and Id is the field containing the Contact ID. Adjust as needed.)

    • On Finish Action:

      • Add an action to display a message, like 'Show Toast' to confirm the contact update.

  4. Test: Save and test.

Important Considerations

  • Autolaunched Flows Only: The "Execute Flow" interaction only works with autolaunched Flows, not Screen Flows.

  • Input/Output Variable Names: The API names of your input and output variables must match strictly between the Flow and the "Execute Flow" configuration.

  • Error Handling: Use the "On Error" action to handle any errors that might occur during flow execution gracefully.

  • Data Types: Ensure that the data types of your input and output variables match between the Flow and the component.

In Summary

The 'Execute Flow' interaction is a valuable feature for adding an autolaunched flow from a Dynamic Component. Configuration settings include setting the flow to trigger, input/output variables and on finish/error actions.

Open Flow Dialog
Open Flow Panel