Sorting

Server-side column sorting in ApiTables

Sorting is server-side. The table UI captures sort intent in Redux; every change triggers a new query-table POST with sorts: tableSorting.

User flow

File: ./ApiTables/core/TableBody.tsxsortServer + onSort handler dispatches _setTableSorting.

tableSorting shape

Stored in tableCore.tableSorting. Typical fields:

FieldPurpose
labelHuman-readable column label (shown in UI badge)
directionSort direction from RDT (asc / desc)
[colIdentifier]Column key → direction (used in API payload)

colIdentifier comes from formatted column data_src / colIdentifier in formatTableColumns.

Active sort UI

File: ./ApiTables/core/TableSorting.tsx

  • Visible when Object.keys(tableSorting).length > 0
  • Shows tableSorting.label and tableSorting.direction
  • Reset button → _setTableSorting({}) → refetch without sort

Structure requirement

Column must have sortable: true in API structure. Non-sortable columns ignore header clicks.

Interaction with pagination and filters

Changing sort does not reset page automatically (unlike filters). Controller refetch uses current currentPage, appliedFilters, and new tableSorting.

Backend contract

The API receives the Redux object as sorts. Exact keys expected are defined by your control-tables backend — align new tables with an existing working table’s payload in network devtools.

On this page