ServerDataTable
OrganismServer-side paginated table. Reads page/totalPages/total/pageSize from the Express route; supports title, toolbar, clickable rows, and empty/loading states.
Orders
142 total
| Order | Customer | Status | Total |
|---|---|---|---|
| #10421 | Alice Johnson | Paid | $129.00 |
| #10422 | Bob Smith | Pending | $54.20 |
| #10423 | Carol White | Refunded | $320.00 |
| #10424 | Dan Brown | Paid | $78.50 |
Showing 1–20 of 142
<%- include('modules/ui/ServerDataTable', {
title: 'Orders',
subtitle: total + ' total',
columns: [
{ key: 'orderId', header: 'Order' },
{ key: 'customer', header: 'Customer' },
{ key: 'status', header: 'Status' },
{ key: 'total', header: 'Total', align: 'right' },
],
rows: orders,
page: page,
totalPages: totalPages,
total: total,
pageSize: 20,
}) %>
<%-- In your Express route: --%>
<%
// const page = parseInt(req.query.page) || 1;
// const { orders, total } = await OrderService.list({ page, pageSize: 20 });
// res.render('orders/index', { orders, total, page, totalPages: Math.ceil(total / 20) });
%>Orders
Click a row to open
| Order | Customer | Status | Total |
|---|---|---|---|
| #10421 | Alice Johnson | Paid | $129.00 |
| #10422 | Bob Smith | Pending | $54.20 |
| #10423 | Carol White | Refunded | $320.00 |
| #10424 | Dan Brown | Paid | $78.50 |
Showing 21–40 of 142
<%- include('modules/ui/ServerDataTable', {
title: 'Orders',
headerRight: '+ New order',
columns: [...],
rows: orders,
page: page,
totalPages: totalPages,
total: total,
pageSize: 20,
getRowHref: function(row) { return '/orders/' + row.orderId.replace('#', ''); }
}) %>Orders
<%- include('modules/ui/ServerDataTable', {
title: 'Orders',
columns: [...],
rows: [],
loading: true
}) %>Orders
| Order | Customer | Status | Total |
|---|---|---|---|
| No orders yet. Your first sale will appear here. | |||
Showing 1–0 of 0
<%- include('modules/ui/ServerDataTable', {
title: 'Orders',
columns: [...],
rows: [],
page: 1,
totalPages: 1,
total: 0,
pageSize: 20,
emptyMessage: 'No orders yet. Your first sale will appear here.'
}) %><%# @deprecated — use `include('modules/ui/Table/Table', { mode: 'server' ... })`.
Backwards-compatible shim — `ServerDataTable` now lives in
`modules/ui/Table/`. %>
<%- include('./Table/Table', Object.assign({}, locals, { mode: 'server' })) %>