GRID FEATURE · PRO
Status and aggregates
The status bar briefly summarizes results such as row counts or range calculations. It helps users understand the visible scope rather than editing data.
How it works and when to use it
true enables the default row-count display. Use supported names for explicit panels, and distinguish total, filtered, and selected row counts.
Using this feature in a product requires the Pro package and a valid license. Matching setting names do not enable Pro features in Community.
In the code, grid is the Grid element prepared in the installation chapter. Check each example's data and settings, and implement the app functions and server endpoints for your project.
Example 1. Default row-count display
Show basic status information below the table.
grid.statusBar = true;Verify the result: The current row-count summary appears. true does not enable every aggregation panel.
Example 2. Separate totals from filtered results
Show total and filtered row counts separately.
grid.statusBar = { panels: [
{ panel: 'totalRows', align: 'left' },
{ panel: 'filteredRows', align: 'right' },
] };Verify the result: Compare counts after searching to understand why fewer rows are visible.
Example 3. Explain remote data scope
With server row models, total server rows, loaded rows, and current-page counts may differ. Distinguish confirmed server rowCount from the loaded range in the app.
Verify the result: Do not present cached-row calculations as server-wide totals. Use separate server aggregation results when complete totals are needed.
Combining features and troubleshooting
The status bar does not replace validation or save-success feedback. Provide a separate message when the result matters.
Define numeric column types and empty-value handling before showing sums or averages.
Related reading
- How rows, columns, and IDs relate
- Connect results and events
- Explore in Features
The guide describes which interactions are available to try.