AX - Data Table

Overview

AX - Data Table is a powerful component for the Salesforce Lightning App Builder that displays your Salesforce records in a clean, interactive table.

This component gives you complete control over how your data appears—customize columns, add filters, enable sorting, and let users interact with records directly from the table.

Use this simple tutorial to learn the basics of the Data Table component and start building your use cases.

Key features

• Data Integration: Pulls records from any Salesforce object (standard or custom).

• Customization: Define columns, enable inline edits, and control search/filter fields.

• Interactivity: Sort, paginate, and export data with minimal clicks.

• Header Styling: Add titles, captions, and icons for context.

• Flexible Display: Show as a card or hide headers for a minimalist design.

• Dynamic Bindings: Use {{Record.FieldApiName}} to pull current record data on Lightning Record Pages.

Component Comparison

This is a lightweight version of the Data Table component optimized for Lightning App Builder's drag-and-drop interface. If you need more advanced options like custom header actions, row-level actions, advanced styling controls, or specialized data type visualizations, consider using the Data Table component in Dynamic Components for complete customization capabilities.

Use Cases

• Account Record Page: Display related Opportunities, Cases, or Contacts with filtering and export options.

• Campaign Page: List campaign members, filter by status or engagement, and export for follow-up.

• Project Page: Display tasks or deliverables with inline edits, enabling efficient management.

• Sales Dashboard: Present open Opportunities, sorted by stage or close date, with CSV export.

• Service Overview: Highlight high-priority or overdue Cases with filters by owner or status.

• Custom Reports Hub: Enable exploration of dynamic record sets (e.g., top accounts) without running reports.

---

Configuration

Add the Data Table to your page in App Builder and configure its properties in the Properties Panel.

Public Properties

These control data, behavior, and appearance.

Best Practice: Use {{Record.FieldApiName}} in properties like headerTitle on Lightning Record Pages to dynamically pull data (e.g., {{Record.FieldApiName}} for current record name).

---

This example shows related Opportunities with filters and inline edits.

Example 2: Campaign Member Checklist

This example lists Campaign Members with filters and CSV export.

Result: A card-wrapped table for Campaign Members, searchable and filterable.

Example 3: Opportunity Summary with Aggregated Metrics

This example displays all Opportunities for an Account with total value and record count metrics in the header.

1

Configure Data Source

Defines which records to display and how they're organized.

• sObjectApiName: Opportunity

• filter: AccountId = '{{Record.Id}}'

• columnFieldNames: Name,Amount,Stage,CloseDate,FullName

• orderBy: Amount DESC

2

Set Header and Metrics

Controls the visual header and summary calculations shown above the table.

• headerTitle: All Opportunities

• headerCaption: Related to {{Record.Name}}

• headerIconName: standard:opportunity

• metricAggregationFields: SUM(Amount), COUNT(Id)

3

Enable Display Options

Configures pagination and user interaction capabilities.

• showPagination: On

• nbItemsPerPage: 25

• allColumnsSortable: On

• allColumnsFilterable: On

Result: A comprehensive table showing all related Opportunities with live-updating metrics in the header. Users can see the total pipeline value and record count at a glance, and sort by any column and filter results. The metrics automatically recalculate when filters are applied, so filtering by Stage instantly shows the sum and count for just those filtered records.

---

Key Considerations

• Dynamic Bindings: Use {{Record.FieldApiName}} on Record Pages for context-aware headers/filters.

• Performance: Limit records (limit) for large datasets; combine with pagination.

• Inline Editing: Ensure editableFields match user permissions to avoid errors.

• Filtering/Search: Select specific fields for precision; allColumnsSearchable simplifies setup but may slow performance.

• Accessibility: Use clear header titles/captions; ensure sortable/editable columns are keyboard-navigable.

---

Troubleshooting Common Issues

• No Records Shown: Verify sObjectApiName and filter syntax; check object permissions.

• Bindings Fail: Ensure {{Record.FieldApiName}} matches current page context; test in preview.

• Search/Filters Missing: Enable searchableFields/filterableFields or toggle allColumns options.

• Edits Not Saving: Confirm editableFields permissions; add On Change interaction if needed.

• Layout Issues: Adjust Style Panel for margins/padding; test card display on mobile.

---

Summary

The Avonni Data Table component delivers a powerful, interactive way to display and manage Salesforce records in App Builder. With filtering, editing, and export features, it enhances data workflows for various roles.

Need More Advanced Features?

This App Builder version provides essential data table functionality with simple configuration. For advanced capabilities like custom actions, complex styling, and specialized data visualizations, explore the Data Table in Dynamic Components for unlimited customization options.