Enhance your Flows with Data Tables – Part 4

Lightning Flow Screen Components are a great way to add power to and improve the look of your Flows.  In this four-part series, I’ll show you how a single component, designed to display a list or table, can enhance your Flows.

The unofficialsf.com website includes datatableFSC as one of many Flow Screen Components you can use for your own organization.

This component is derived from the datatable Lightning Base Component.  I recently enhanced the base component to be more powerful and Admin friendly.

I will be showing you some examples about how the Datatable component:

  • Can be used in place of a Record Choice Set (Dynamic Record Choice) for selecting a record while displaying more than a single field
  • Can be used to select multiple records from an object then perform additional actions on them
  • Can be used to present your data in an interactive and visually enhanced format
  • Can be used to display and inline edit a collection of records

Part 4: Inline Editing

In November of 2019, Kirill Boyarkin, updated this component to support inline editing. Now you can specify individual columns as editable and the changed values will be passed back to your Flow so you can update the object records.

In this example, I created a simple Flow to present a list of Account records with the Annual Revenue column set to editable.

The Get Records node populates an SObject Collection variable with the records and fields I want to display in my datatable.

I pass that collection into the datatableFSC component on my Flow Screen, define the columns I want to display and set the Revenue column to be editable.

This component has a lot of attributes, so make sure you assign any output attributes in the Output Values section. For my output attributes, I select “Manually assign variables (advanced)” and assign my new SObject collection variable to the same Collection – Accounts attribute I used to pass in my records.


NOTE: The output attribute for selected records (Output Selected Accounts) is only used for identifying selected records in the datatable and may not contain the updated values. When you are combining editing and selecting in a single table, use the “Output Selected Accounts” attribute to get the list of selected records and their IDs and use the “Collection – Accounts” attribute to access the edited records.


The final Update Records node in my Flow is to update the Account object with my collection of edited records.


If you Show the checkbox column with your datatable, you will be able to select multiple rows and optionally apply an edit to all of the selected rows.

By default, the component will display Cancel and Save buttons once you start making edits. You can bypass this option by setting the “Show Save and Cancel Buttons?” attribute to False. Any edits will then be automatically saved once you hit the Next button.

Note: If there are a large number of records in the datatable, the Next button will always display at the bottom of the screen, but the user will have to scroll to the end of the table to see the Cancel and Save buttons.


See the complete series on how you can use the datatable Flow Screen Component in your Lightning Flows.

Part 1 – Use a Datatable to present a dynamic choice for record selection in a Flow.
Part 2 – Use a Datatable in a Flow to select and act on a collection of records.
Part 3 – Use a Datatable to display a formatted, interactive table in your Flow.
Part 4 – Use a Datatable to inline edit a group of records.



205 thoughts on “Enhance your Flows with Data Tables – Part 4

  1. Make sure you are putting the variable assignment in the Output section. All attributes are listed in both the input and output sections even though they may only be used in one of them.

    Like

    1. I am use Summer 20 release and it has only the output edit row section, what exactly should assign there since i want to use the return collection with the change in a loop ?

      Like

    2. Hi Eric,

      Thanks for the guide! I really appreciate it!

      There is one thing I’ve noticed. The “Select All Rows” feature is not working when launching a Screen Flow from the Salesforce Mobile App via Salesforce Map Action.

      Any chance to look into it?

      Like

    3. @Eric Smith – Can make the lookup field inline editable, what all configuration needs to be done in datatable element?

      Like

  2. i didn’t referee to the right collection on loop that was the issue – i have other question if i set suppress-bottom-bar to True am i going to be able to have Save and Cancel buttons on lightning datatable always showing even without editing ? if not what should i adjust to make these 2 buttons always visible ?

    Thanks

    Like

  3. i am cloning Opp with related objects (contact and Products) using flow so when i edit the products and save it , it saves in the new created opp record but when i try to proceed with the pre-selected products, it doesn’t get saved in the new created record – i am not sure how to make outputSelected and outputEdited works together

    Like

      1. I’m putting together a Blog post on how to do this. I add a link here when it’s ready.

        Like

  4. Hi Eric! Thank you so much for the blog really helps a lot, i have other question hopefully this is my last question 🙂 when i tried to install the unmanaged package production Version it is giving me the error of mismatching version i know our production org hasn’t been updated to summer 2020 – there is any way to get the package install even version don’t match ??

    Like

  5. Thank you for the great overview. I’m having pretty good luck with it, but the “Show or Hide Checkbox Column” setting is not accepting hide as a valid value… and the “Show Save and Cancel Buttons” setting is not accepting False or any variation of False (like {!$GlobalConstant.False} ). Any tips to resolve?

    I suppose this may be moot for the time being in that I am working in Sandbox and if I understand your above comment correctly I won’t be able to install this package (version 2.7 unmanaged) in my Production Org anyway for now?

    Many thanks for any tips or assistance. It’s a great tool – the kind of thing that should be native. 🙂

    Like

      1. Hi Eric.
        I have not been able to install Datatable v2. I have checked that preinstallation prerequisites are installed and updated but I get the following error from this URL: https://githubsfdeploy.herokuapp.com/app/githubdeploy/ericrsmith35/DatatableV2

        …..

        Status: InProgress
        Status: InProgress
        Status: InProgress
        Status: Completed
        Deployment Complete
        Error: errorInternal Server Error
        lwc/datatableV2Spring20/datatableV2Spring20.html
        lwc/datatableV2Spring20/datatableV2Spring20.js
        lwc/datatableV2Spring20/datatableV2Spring20.js-meta.xml
        lwc/datatableV2/datatableV2.js-meta.xml
        lwc/datatableV2/datatableV2.js
        lwc/datatableV2/datatableV2.html
        package.xml
        flows/Datatable_Configuration_Helper.flow
        flows/Datatable_Configuration_Helper_Temp_SubFlow.flow
        classes/SObjectController2Test.cls
        classes/SObjectController2.cls
        classes/SObjectController2Test.cls-meta.xml
        classes/SObjectController2.cls-meta.xml

        Liked by 1 person

  6. Eric – This component very helpful. I try use the DatatableV2 lwc component in Developer Edition Org.
    When I deploy to the Org, I get below error

    force-app\main\default\lwc\datatableV2\datatableV2.js The ‘propertyType’ tag isn’t supported for lightning__FlowScreen

    Like

  7. Love the new improvements with V2! Thanks for the great work.

    I have a currency field that is (12,6). When I try to enter more than 2 digits to the right of the decimal I get an error “Your entry isn’t a valid increment”. I have tried setting the Special: Column TypeAttributes to USD_Cost__c:{maximumFractionDigits:6} but that didn’t seem to have an effect. Any ideas?

    Like

  8. Hi Eric, love the datatable, and I’ve built out my first solution using it. It’s almost working perfectly. I’m pulling down Opportunity Products, display on a screen with datatable and ask user to select which items they want to edit. Then the next step takes the selected items from the datatable (in a collection variable), and assigns a value from a formula field to a currency field using a loop, then updates the records from the collection outside the loop. Next step is to display the items in a second screen with a datatable with the option to edit the currency field in order to overwrite the system generated value. In the second screen, the currency field doesn’t show the updated value, even though the assignment step is happening and DML operations happen. Any suggestions?

    Like

  9. Hi Eric! Thank you for the latest version. Quick question, when displaying RecordTypeId it shows as a link in the table. This isn’t very useful for end-users. Anyway to turn it off?

    Like

      1. I’m showing the recordtype name, but the value shows as a link in the datatable to the recordtype itself, it would be useful if there were a “read only” feature wherein the grid does not make any linkable values (similiar to what you did with the Name field).

        Like

  10. Hi, Eric…its been a while since I’ve used the component, really like the upgrades. Is there a way to validate the inline edit without going through a loop/decision?

    Like

      1. I would like to validate an edited field…

        I am creating a simple survey, Im listing a handful of questions in the table, each question has a max score, I would like to make sure the user cannot input a number above the questions max score.

        Like

      2. Jake – What you are looking to do can be done but it is not part of the base datatable component. You or a developer could customize my code to validate the entries while the user is interacting with the datatable.

        Like

  11. Hello, I need to do edit values of a picklist, Is that possible? because I tried to put in “type of colum ” picklist but it does not work. Please Could help me?
    Thanks!!

    Like

  12. Hi Eric, this is a great component and it works great when I select a single record in the datatable to edit, but when I select more than one record for update, and use the option to apply the update to all selected records and click Next I receive this error:
    [‘set’ on proxy: trap returned falsish for property ‘1’]
    The field I’m editing is a checkbox, as picklist fields are not yet supported.

    Do you know why I’m receiving this error?
    Thanks for any help.

    Like

      1. Hi Eric, I reference the component a couple of times depending on the path taken at the beginning of the flow. I’m using the component to update checkboxes and date fields in the first screen component, then once all updates are processed, I use the component again to only display (no ability to select records) to show the final updates. As I mentioned I am using the component so far 4 times in my flow, 2 in each of the two paths I have.
        It was working fine, when I only had the single path in the flow.
        But when I added the second path and all of its components including the 2 additional screen component with the data table component I click save and received the error I posted for every screen component that included the data table.
        Is there any limitation is using the data table component in as many screen components in the flow?

        Like

    1. Thank you for the quick responses!
      I will check – I tried to name them uniquely, but may have selected the wrong variable.
      And just to confirm:
      – the component supports checkboxes
      – the component can be used more than once in the same flow

      I have changed my underlying picklist fields to checkboxes, but if I wanted to use the text option, when I write the update, would I need to assign a choice variable the text value, before attempting to update the record? I wanted to clarify how to use the text option while picklists are not yet supported for update.

      Like

    1. Thank you for your support and feedback.
      I’m trying to use the inline editing feature that if I select more than one row, then set the checkbox field to true (check it) and also check the box in the edit window to “Update the n selected items”, I find only the first row select and that includes the edited checkbox change is applied. The other selected row(s) are not updated even though I checked the box to “Update the n selected items”.
      Do you know what would cause the flow to only apply the update to only the row that was edited even though multiple rows were selected and the check box “Update the n select items” was checked?

      Like

      1. I have checked the record collection variables used and they are unique to each get records and what is being used in each of the data table components for each of the screen variables.

        I created a simple version of the flow, get records from a custom object place in a record collection variable. Display a screen component that uses the data table component that uses the record collection variable used in the Get Records as the source. Listed the checkbox field as editable, and set Hide Checkbox Column to False, as I want the user to be able to select multiple rows and I want the user to be able to use inline editing.

        Run flow in debug mode:
        For debugging, I’ve created another record collection variable to store the multiple records selected and can verify the multiple records are selected, I display them in a screen to validate they were captured.

        I select 2 rows from the list. Then I in-line edit the checkbox on the first selected row (record), and check the option to update the 2 selected items. Click Save, then click Next.
        The flow next performs Update Records using the record collection variable (Output Edited Rows) as was specified in the data table component.
        Next I perform a Get Records and places the records from the underlying object into another record collection variable, and use that in another screen component with the data table component and use that record collection variable as the source to validate the updates.
        In debug mode, I see that only the first selected record’s checkbox was updated.

        If I activate the flow, run it and perform the same, selecting 2 rows (records) for update, update the first record’s checkbox, select the option to update the 2 selected items, click Save, then click Next, I receive this error:

        Message: [‘set’ on proxy: trap returned falsish for property ‘1’]
        Component Descriptor: markup://c:datatableLwcFsc
        File Name: https://..myorg..lightning.force.com/auraFW/javascript/uB7Kis-nrXhbA1D0ce6Sog/aura_prod.js
        Function: Proxy.I
        Line: 37, Column: 83403
        Stack Trace:
        Proxy.l()@https://ls-tb-org2020-123-dev-ed.lightning.force.com/auraFW/javascript/uB7Kis-nrXhbA1D0ce6Sog/aura_prod.js:37:83403
        eval()@https://ls-tb-org2020-123-dev-ed.lightning.force.com/lightning/action/quick/modules/c/datatableLwcFsc.js:4:12381
        c.handleSave()@https://ls-tb-org2020-123-dev-ed.lightning.force.com/lightning/action/quick/modules/c/datatableLwcFsc.js:4:12077

        I’m hoping these details can help shed some light on what my issue might be.
        Thanks again for any help to resolve this error.

        Like

  13. Hi Eric, Thank you for building this table for Flows, It is working great! The only thing i can’t figure out is how I can use a decision to determine if a row has been selected. I have a need to show and error screen if someone has selected a row from the table and also made a selection from another set of radio button options on the same screen. I have tried using the ‘Output Selected Rows’ collection variable with an ‘is null = False’ outcome on the decision element, but it is not doing what I am expecting. Do you know how I can make a decision based on whether a row from the table has been selected?

    Like

  14. Hi Eric,

    Amazing component, and really grateful to you for making it open source, and feely available. Thanks.

    I’m having an issue with saving and then displaying again edited rows.

    A collection ({!COLL_QLsToImport}) is successfully displaying in the datatablev2. Edit rows are successfully saving in the output variable ({!COLL_EditedQLs}). However, I am then trying to display the full (partially edited) collection on another (subsequent) screen. I have tried a few ways of doing this but without success. None of these methods work:
    1. Simply displaying the parent variable (after edits) in a new datatablev2 – edits do not come through, original data is displayed. [From your documentation, I think this one should work??]
    2. Removing edited row ids from parent variable, and then adding edited collection back to parent variable – the removal step does not work, results in duplication of rows. Have tried this by removing whole collection (one transaction) and one by one (in a loop) and by putting the edited rows into a separate collection of ids and removing that collection from the parent variable – same outcome with all of these: removal does not work, but adding does, so duplication of edited rows.
    3. Variation of #2: Deleting edited records, then adding edited rows variable to parent variable – same outcome, adding works, deletion doesn’t, duplicated rows.
    4. Looping parent variable rows, sub-loop edited rows and writing edits to parent variable – writes do not happen, so unedited data is then displayed.
    5. a few variations on the above.

    I can get the edited collection to display the edited rows successfully, so that bit is definitely working; it’s getting those edits back into the parent variable so that they can be displayed that is the problem.

    Display Save/Cancel button is supressed, and I’m using a navigationButtonFSC with Navigation = next to get to the next screen.

    Can you offer any advice here about how to get the edits to persist through to the subsequent screen?

    Much appreciated.

    Like

  15. Thanks Eric – this is great!

    Do you have (or are working on) an update where we can embed Opportunity Related Lists like Product Line Items & Contact Roles?

    Like

      1. Thanks for the quick response!

        I’m fairly new to Flows so I apologize if I’m missing something obvious but I’m not able to get at the Product Line Item related list within the datatableFSC screen component.

        I’m trying to create a Screen Flow which shows all the products listed on an opportunity (recordID passed from start). From there, I’m hoping I can enable inline editing to these products for sales reps to update directly from the screen. Maybe this isn’t possible?

        Any directional advice would be much appreciated

        Like

  16. Hi Eric,

    Great Product! I have a little situation here and hope you could give me an advice.
    I’m using the datatable to display some sort of submission and one of the fields is a checkbox (e.g Approve the Submission”). I managed to do the inline editing, however once I edit the checkbox, I see the ✔️ sign, I click on Save (at the bottom of the table), but when I refresh the page, the ✔️ sign disappears.

    Thank you in advance for your time!

    Like

  17. Fantastic thread – Does inline editing work with Professional Edition?

    I have it working in my Dev org but not in PE. Assuming it doesn’t due to Apex but wanted to confirm.

    Thanks!

    Like

  18. Eric,

    I love this component and am using it many flows. Thank you!

    In a flow, I am using the opportunity product as the object for the table. I have a use case where a user selects a product called ‘Misc-Other’ that I will be eventually adding to an opportunity. In this scenario, I require the user to complete a description field to better identify the miscellaneous product. There may be times when a user may need to add multiple Misc-Other products to the opportunity. Does the component have any functionality to add rows to the collection, so I can get the user to fill in the description on each line? I thought about using a screen to ask the user how many lines they need to add, but not sure I can create a loop to add x rows to a collection to then show in a table where they can inline edit.

    Like

    1. You can add “new” records to the collection before displaying it in the datatable. You have to include a dummy unique id for each of the records in order to have it work correctly. For example, if you are adding 5 Opportunity Lineitem records you would have to give each an id like these:
      00k000000000001
      00k000000000002
      00k000000000003
      00k000000000004
      00k000000000005

      You would need to clear the ids before trying to write the edited records to the Opportunity Lineitem object.

      Here is a link to the 3 character prefix for each of Salesforce’s standard objects. http://www.fishofprey.com/2011/09/obscure-salesforce-object-key-prefixes.html

      Like

  19. Hey Eric – thanks for this!

    I’m trying to use this to get users to classify Event records – is there any chance datatable will / can support Events?

    Like

      1. Thanks!

        When I select Display All Objects, configure, and exit out of the screen flow element, then come back, it looks like this gets cleared and I have to re-configure. Am I thick and missing something I need to do to persist this setting?

        Like

  20. Is there any functionality or strategy you could recommend to show parent object data in table 1 and related children records as either an indented or expandable section within the same table or select a row from table 1 and show the related data in a second table maybe through use of filters? Trying to keep both tables on the same screen flow.

    Example: list of accounts in table 1 and related opportunities in second table

    Like

  21. Hi Eric, This is phenomenal, thank you! Do you have any idea of the timeline before editing picklists might be supported, or any workarounds in the meantime? Thanks!

    Like

  22. Hi,

    To your knowledge, is there any way to add new records to this table, inline? We use your DataTable in our flows and it works great, but there is some desire to get back some functionality that we used to have with our custom-coded flow in classic. We had a way to add new records by just clicking an “add new” button and then filling out each column that is already represented on the table, without leaving the page.

    Is that doable with your tool? Thank you for any info you can share!

    Like

    1. The workaround for now is to manually add a “blank” record to the collection before displaying the datatable. The only requirement is that you first give the record a fake record Id that is the same first 3 characters of the normal record ids for that object followed by 15 0’s. After the screen where you entered the data, clear the record id value and use a Create Records to add the new record with the edited values from the datatable.

      Liked by 1 person

  23. Is there a way to show records that haven’t been created yet in the datatable? I have a form that users will fill out and I want to show the old and new values in a table format using datatable.

    Like

    1. You can if they are in a collection variable of the right object type. You do however, have to have the field specified as the Key Field containing a unique value for each record. Most people give each new record a unique dummy RecordId before they display them in the datatable. The first 3 characters of the 15 character Id should match the Salesforce value for that object type. For example, Account is 001 and Opportunity is 006. You then have to clear the values in that field before passing the collection to a Create Records element.

      Like

  24. Hi Sir,

    I am newbie when it comes to flows. I downloaded your datatable component and have this error everytime I edit the table column(Configure Column)

    We can’t launch this flow because of a variable error. Send this error message to your admin. The value null is being provided for variable vSobject but isn’t compatbile with the variables data type(String)/ Check the places where you implemented the flow – such as through a lightning page or a custom button – and make sure that all provided values are compatible with the variables data types.

    Like

  25. Hi Eric,
    This is a fantastic component; thank you much. We are running into an issue when we attempt to display a checkbox field as one of the columns in the datatable. In the component, we set the “column_type” attribute to type “Boolean” and the design time type for the column to “{!$GlobalConstant.False”} . And when we attempt to load the screen, it gets stuck in “loading”. Are we missing something?

    Like

  26. Please try v3.1.1 of the LWC if you can. The documentation mentions all of the supporting components that are used by the Datatable. I am no longer able to support older versions.

    Like

  27. Hi Eric, I am using datatable V2.How to display custom object name field as a link in datatable. Please suggest.

    Like

    1. 1. In order for a lookup or master/detail field to display as a link, it must be “reparentable”

      2. In order to have the Datatable display a Lookup field as a link to the record rather than just the recordId value in the field, the running User must have Edit access to the object whose records are being displayed in the Datatable. For example, if you have a Datatable for Contact records and include the AccountId(Lookup) field, the running User needs to have Edit access for the Contact object in order for the AccountId field to show as a clickable link with the Account’s Name. Without Edit access to the Contact record, the Datatable will display, as unclickable, the Account’s recordId value. For information on how you can temporarily add then remove Edit access in a Flow, read the referenced Help Article and/or complete the referenced Trailhead.

      Help Article: Create a Flow That Can Activate or Deactivate a Session-Based Permission Set
      https://help.salesforce.com/articleView?id=sf.perm_sets_session_activate_flow.htm&type=5

      Trailhead: Session-Based Permission Sets and Security
      https://trailhead.salesforce.com/content/learn/modules/session_based_perms

      Like

  28. Hello

    Thanks for putting this component together, it’s very useful. I was able to get the table to load for standard objects but am having issues with a custom object. I edited the datatableFSC.cmp and the datatableFSC.design files to include the custom object name and it shows up on the flow screen page. It’s not returning any data to the table though. I checked the debug log and the get records are finding the records but no displaying it in the table. I checked to make sure I was using the API field names and those are correct. Any suggestions?

    Thanks in advance

    Like

  29. Hi Eric,

    its a very nice tool. I was wondering if there is also an option to have like a sum formula over the edited records.

    So in your case like a variable that shows the total of annual revenues that are edited on the screen?

    Many thanks
    Carolin

    Like

  30. Hi Eric,
    I’m using DataTable version 3.3.2. It works fine for me for some objects like Case and custom objects, but for objects such as Account and Service Appointment, whenever I select several rows and press Next I get an error message like this.

    Unfortunately, there was a problem. Please try again. If the problem continues, get in touch with your administrator with the error ID shown here and any other related details. Error ID: 930094542-82720 (-414970662)

    Any suggestions on what’s causing this.
    Thanks very much!

    Like

  31. Hi Eric,

    Thanks for the Datatable – really useful and gets me out doing a bunch of work to create a LWC to do the same task.

    I want to use the inline edit function – but I need to update some other fields on the form when an edit is made in the datatable. IE, I need a change in the table to trigger the next flow step: is there anyway to achieve this?

    Thanks.

    Like

    1. The only way to do this currently is to navigate past the screen and have a decision node check what the edits were. In about a year Salesforce will be supporting Reactive Screens which will then allow more immediate interactions.

      Like

      1. Ok, thanks, that’s what I’m doing at the moment, is a slightly less than intuitive user experience though.

        What about the “Save” button though – would it be possible to have that trigger the navigate past the screen?

        Thanks again
        MRG

        Like

  32. I am having an issue similar to the issue you reported here https://trailblazer.salesforce.com/issues_view?id=a1p4V0000020sShQAI, but with some differences.

    1. I am not using the datatable in a screen with a section.
    2. The first time I attempt to inline edit a value it reverts to the original value when I click Apply, but the second time I attempt to edit it appears to save the value.
    3. The edited values are not passed by the component. This is a recent development as this component used to pass the edited values.
    4. I am using Apex defined input data.

    Any ideas you have would be awesome!

    Like

    1. I have faced the same problem as Josh mentioned above. When I want to add a standard section in a screen element with datatable, I can not use inline edit function as it has to be. It shows the original value even I save the changes or try the same scenerio with “hide save button” selection checked. After removing “the section” inline edit works very fine. Updated the latest version (3.5.0) but the same.

      Btw it is so great to know that there is a datatable feature in flow! Thanks for this Eric!

      Like

  33. I just updated to 3.5 to take advantage of the suppress currency conversion feature, which works great. There is one minor issue I has hoping you could address. The currency field converts to the currency of the record which in this case is Euro but the sign stays in Dollars. So it says $1,234 instead of €1,234. Is there an override for this? The sign seems to be driven by the user’s default currency even with the suppress currency conversion feature set to true. I changed my default currency and it updates the sign on the datatable component.

    Thanks in advance!

    Like

    1. I figured it out but thought I’d share

      For special type attributes I added this. Amount__c:{currencyCode:'{!Get_Quote.CurrencyIsoCode}’}

      Amount__c = the currency field
      currencyCode = the function
      Get_Quote.CurrencyIsoCode = the record I’m pulling the currency code from

      Like

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s