Ctrlk
YouTube ChannelBook A Demo🪄 Build with AIJoin The Community
For the complete documentation index, see llms.txt. This page is also available as Markdown.

Enable Inline Editing

Overview

The Avonni Data Table supports two modes of inline editing to suit different workflows:

  • Quick Edit (Pencil Icon): The standard Salesforce behavior. An edit icon appears on hover, allowing users to modify specific cells.

  • Direct Entry (Input Box): Transforms cells into permanent input fields or picklists. This is the fastest method for heavy data-entry tasks

Interactive Tutorial

Guided Steps

1

Enable the Editing Interface

You can enable editing for specific fields or the entire table at once.

To enable a single column:

  1. Navigate to the Data Mappings section.

  2. Click on the specific Column Name you wish to make editable.

  3. For Quick Edit: Toggle the Editable switch to ON.

  4. For Direct Entry: Toggle the Display as Input switch to ON.

Pro-Tip: Dynamic Row-Level Editing

You don’t have to settle for a column being "always editable" or "always read-only." You can dynamically control editability for specific rows by binding the Editable attribute to a Formula Field (Checkbox) from your Salesforce object.

This ensures your UI respects complex business logic. Instead of locking an entire column, the table intelligently enables the "pencil icon" only for records that meet your criteria.

  • The Salesforce Setup: Create a Formula Field on your object with a Checkbox return type (this provides the "True/False" Boolean logic the table needs).

  • The Logic: For example, if you only want the "Description" editable for Banking clients, your formula would be: ISPICKVAL(Industry, "Banking").

  • The Mapping: In the Data Table Data Mappings, select your column, find the Editable attribute, and map it to your new Formula/Checkbox field instead of using the manual toggle.

The Result: The "Description" cell will show an edit icon for Banking records but remain locked for all other industries, enforcing your business rules at the row level.

To enable all columns at once:

If you want to make every compatible field in your table editable with a single click:

  1. Navigate to the Data Mappings section in the Properties Panel.

  2. Open the Advanced Options sub-section.

  3. For Quick Edit: Toggle All Columns Editable to ON.

  4. For Direct Entry: Toggle All Columns Display as Input to ON.

    Note: This acts as a global override. It is the fastest way to turn a "View-Only" table into a "Data Entry" worksheet

2

Configure the "Save" Logic (Crucial)

Important

Modifying a cell only changes the value in the browser. To make these changes permanent in Salesforce, you must configure an "On Save" interaction.

  1. Open Interactions: Click on the Interactions tab in the Properties Panel.

  2. Select the Trigger: Click to add a new interaction and select the On Save event.

  3. Choose the Action: Select Update Records from the list of available actions.

  4. Configure Feedback (Optional): Add a "Toast" message or a success notification to let users know their changes were saved successfully.

Key Technical Notes

  • The "Row Number" Column: When inline editing is active, Salesforce automatically displays a Row Number column on the left. This is a technical requirement for tracking "draft" changes and cannot be hidden.

  • The Footer Bar: As soon as a user modifies a cell, a footer bar with Save and Cancel buttons will automatically appear at the bottom of the table to manage the transaction.

  • Validation: Ensure the user has the appropriate Salesforce permissions to edit the underlying records, or the "Update Records" action will fail

Last updated

Was this helpful?