Live Demos

Table Examples

Interactive demos showcasing every feature of the table system with real data.

Basic

Basic Table

A simple table with sorting, pagination, and an auto-generated row number column.

NO
1
Zaid Faroukzaid.farouk@work.copendingadmindesign2021-08-21
2
Emma Mustafaemma.mustafa@org.netpendingviewerengineering2021-03-08
3
James Williamsjames.williams@company.cominactiveviewerengineering2023-07-21
4
Ali Mansourali.mansour@company.compendingeditorengineering2021-01-14
5
Sami Millersami.miller@org.netinactiveadminengineering2023-05-04
6
Nora Williamsnora.williams@org.netactiveviewermarketing2023-01-18
7
Ali Abdullahali.abdullah@company.cominactiveviewermarketing2025-07-25
8
Daniel Faroukdaniel.farouk@work.coactiveadminengineering2022-02-28
9
Zaid Daviszaid.davis@company.compendingviewerengineering2024-03-28
10
Huda Millerhuda.miller@company.compendingeditormarketing2022-08-08
Search

Searchable Table

Unified search bar filtering across name and email columns with local filtering.

NO
1
Zaid Faroukzaid.farouk@work.copendingadmindesign2021-08-21
2
Emma Mustafaemma.mustafa@org.netpendingviewerengineering2021-03-08
3
James Williamsjames.williams@company.cominactiveviewerengineering2023-07-21
4
Ali Mansourali.mansour@company.compendingeditorengineering2021-01-14
5
Sami Millersami.miller@org.netinactiveadminengineering2023-05-04
6
Nora Williamsnora.williams@org.netactiveviewermarketing2023-01-18
7
Ali Abdullahali.abdullah@company.cominactiveviewermarketing2025-07-25
8
Daniel Faroukdaniel.farouk@work.coactiveadminengineering2022-02-28
9
Zaid Daviszaid.davis@company.compendingviewerengineering2024-03-28
10
Huda Millerhuda.miller@company.compendingeditormarketing2022-08-08
Filters

Filterable Table

Multi-select filters for Status and Department, single-select for Role.

Filter by:
NO
1
Zaid Faroukzaid.farouk@work.copendingadmindesign2021-08-21
2
Emma Mustafaemma.mustafa@org.netpendingviewerengineering2021-03-08
3
James Williamsjames.williams@company.cominactiveviewerengineering2023-07-21
4
Ali Mansourali.mansour@company.compendingeditorengineering2021-01-14
5
Sami Millersami.miller@org.netinactiveadminengineering2023-05-04
6
Nora Williamsnora.williams@org.netactiveviewermarketing2023-01-18
7
Ali Abdullahali.abdullah@company.cominactiveviewermarketing2025-07-25
8
Daniel Faroukdaniel.farouk@work.coactiveadminengineering2022-02-28
9
Zaid Daviszaid.davis@company.compendingviewerengineering2024-03-28
10
Huda Millerhuda.miller@company.compendingeditormarketing2022-08-08
Actions

Custom Actions Table

Row-level actions (edit, show, delete) rendered in a dropdown menu.

NO
Actions
1
Zaid Faroukzaid.farouk@work.copendingadmindesign2021-08-21
2
Emma Mustafaemma.mustafa@org.netpendingviewerengineering2021-03-08
3
James Williamsjames.williams@company.cominactiveviewerengineering2023-07-21
4
Ali Mansourali.mansour@company.compendingeditorengineering2021-01-14
5
Sami Millersami.miller@org.netinactiveadminengineering2023-05-04
6
Nora Williamsnora.williams@org.netactiveviewermarketing2023-01-18
7
Ali Abdullahali.abdullah@company.cominactiveviewermarketing2025-07-25
8
Daniel Faroukdaniel.farouk@work.coactiveadminengineering2022-02-28
9
Zaid Daviszaid.davis@company.compendingviewerengineering2024-03-28
10
Huda Millerhuda.miller@company.compendingeditormarketing2022-08-08
Export

Export & Custom Buttons

CSV export, row selection, and a custom toolbar button.

NO
1
Zaid Faroukzaid.farouk@work.copendingadmindesign2021-08-21
2
Emma Mustafaemma.mustafa@org.netpendingviewerengineering2021-03-08
3
James Williamsjames.williams@company.cominactiveviewerengineering2023-07-21
4
Ali Mansourali.mansour@company.compendingeditorengineering2021-01-14
5
Sami Millersami.miller@org.netinactiveadminengineering2023-05-04
6
Nora Williamsnora.williams@org.netactiveviewermarketing2023-01-18
7
Ali Abdullahali.abdullah@company.cominactiveviewermarketing2025-07-25
8
Daniel Faroukdaniel.farouk@work.coactiveadminengineering2022-02-28
9
Zaid Daviszaid.davis@company.compendingviewerengineering2024-03-28
10
Huda Millerhuda.miller@company.compendingeditormarketing2022-08-08
Loading

Loading State

Skeleton loading state shown while data is being fetched.

Empty

Empty State

What the table looks like when no data matches the current query.

NO

No records found

Try adjusting your filters or search query.

Advanced

Advanced Filter Table

Per-column filter rules with operators like 'is', 'is not', 'contains', and AND/OR multi-filter support.

NO
1
Zaid Faroukzaid.farouk@work.copendingadmindesign2021-08-21
2
Emma Mustafaemma.mustafa@org.netpendingviewerengineering2021-03-08
3
James Williamsjames.williams@company.cominactiveviewerengineering2023-07-21
4
Ali Mansourali.mansour@company.compendingeditorengineering2021-01-14
5
Sami Millersami.miller@org.netinactiveadminengineering2023-05-04
6
Nora Williamsnora.williams@org.netactiveviewermarketing2023-01-18
7
Ali Abdullahali.abdullah@company.cominactiveviewermarketing2025-07-25
8
Daniel Faroukdaniel.farouk@work.coactiveadminengineering2022-02-28
9
Zaid Daviszaid.davis@company.compendingviewerengineering2024-03-28
10
Huda Millerhuda.miller@company.compendingeditormarketing2022-08-08
Server-Side

Server-Side Pagination

Simulated server-side pagination with external page and page-size control.

NO
1
Zaid Faroukzaid.farouk@work.copendingadmindesign2021-08-21
2
Emma Mustafaemma.mustafa@org.netpendingviewerengineering2021-03-08
3
James Williamsjames.williams@company.cominactiveviewerengineering2023-07-21
4
Ali Mansourali.mansour@company.compendingeditorengineering2021-01-14
5
Sami Millersami.miller@org.netinactiveadminengineering2023-05-04
6
Nora Williamsnora.williams@org.netactiveviewermarketing2023-01-18
7
Ali Abdullahali.abdullah@company.cominactiveviewermarketing2025-07-25
8
Daniel Faroukdaniel.farouk@work.coactiveadminengineering2022-02-28
9
Zaid Daviszaid.davis@company.compendingviewerengineering2024-03-28
10
Huda Millerhuda.miller@company.compendingeditormarketing2022-08-08
Cursor

Cursor-Based Pagination

Simulated cursor-based pagination with Prev/Next navigation, optional total count, and page-size control — ideal for GraphQL Relay or keyset APIs.

NO
1
Zaid Faroukzaid.farouk@work.copendingadmindesign2021-08-21
2
Emma Mustafaemma.mustafa@org.netpendingviewerengineering2021-03-08
3
James Williamsjames.williams@company.cominactiveviewerengineering2023-07-21
4
Ali Mansourali.mansour@company.compendingeditorengineering2021-01-14
5
Sami Millersami.miller@org.netinactiveadminengineering2023-05-04
6
Nora Williamsnora.williams@org.netactiveviewermarketing2023-01-18
7
Ali Abdullahali.abdullah@company.cominactiveviewermarketing2025-07-25
8
Daniel Faroukdaniel.farouk@work.coactiveadminengineering2022-02-28
9
Zaid Daviszaid.davis@company.compendingviewerengineering2024-03-28
10
Huda Millerhuda.miller@company.compendingeditormarketing2022-08-08