Server Table

A generic Flutter data table for server-side data with built-in pagination, sorting and filtering.

The package is backend agnostic. It works with OData APIs as well as custom REST APIs by configuring the response mapping.

Features

  • ✅ Server-side pagination
  • ✅ Server-side sorting
  • ✅ Server-side filtering
  • ✅ Generic DataSource
  • ✅ Dio integration
  • ✅ Custom response mapping
  • ✅ Custom loading, error and empty states
  • ✅ Generic column definitions
  • ✅ Type-safe models

Installation

Add the package to your pubspec.yaml.

dependencies:
  server_table: ^1.0.0

Then run:

flutter pub get

Create a Dio client

final dioClient = DioClient(
  baseUrl: 'https://api.example.com',
);

dioClient.setAuthorization(token);

Create a DataSource

final customerSource = DataSource<Customer>(
  client: dioClient,
  endpoint: '/customers',
  fromJson: Customer.fromJson,
  responseConfig: const ResponseConfig(
    itemsPath: 'data.items',
    totalCountPath: 'data.totalCount',
  ),
);

Create a Controller

final controller = ServerTableController<Customer>(
  dataSource: customerSource,
);

Define Columns

final columns = [

  ServerColumn<Customer>(
    title: 'Name',
    field: 'name',
    sortable: true,
    filterable: true,
    cellBuilder: (context, customer) {
      return Text(customer.name);
    },
  ),

];

Display the Table

ServerTable<Customer>(
  controller: controller,
  columns: columns,
)

Response Mapping

Every API returns data differently.

Configure the response once using ResponseConfig.

Example:

{
  "data": {
    "items": [],
    "totalCount": 100
  }
}

Configuration:

ResponseConfig(
  itemsPath: 'data.items',
  totalCountPath: 'data.totalCount',
)

Built-in Features

  • Server pagination
  • Multi-column configuration
  • Server sorting
  • Server filtering
  • Horizontal scrolling
  • Loading state
  • Error state
  • Empty state

Requirements

Flutter 3.35+

License

MIT

Libraries

server_table