Skip to main content
Skip table of contents

TablePagination

Overview

TablePagination represents the component to change with the Table page.

Please refer to this for more information: https://mui.com/material-ui/api/table-pagination/.

Import

CODE
import { TableContainer, TablePagination } from '@mui/material';

The above source will be imported automatically after dragging and dropping the Basic Component to the UI Preview Panel.

Property

Property:

Name

Default

Description

Id-name

Placeholder: <id-name>

The Id-name of the created component.

State

State: Normal

The State of the created Component.

Padding

Size Unit: Px

The component Padding with many selectable Size Units.

Size

Size Unit: Px

The component Size of Height with many selectable Size Units.

General

Firstbutton: False

Lastbutton: False

Count: 10

Page: 0

RowPerPage: 10

Visibility: None

The component General includes Firstbutton, Lastbutton, Count, OnPageChange, Page, LabelRowsPerPage, RowsPerPage, Visibility, and Background.

Advanced Style

The component Advanced Style includes Classname and Inline Style addition.

Code Sample:

CODE
 <TablePagination
                  id="TablePagination1"
                  count={5}
                  rowsPerPage={1}
                  page={1}
                  onPageChange={() => {}}
                  sx={{':active': {'padding': '15px 15px 20px 20px','height': '150px',
                      'visibility': 'visible','backgroundColor': '#910000ff',},}}
                  showFirstButton={true}
                  showLastButton={true}
                  labelRowsPerPage="Label1">
 </TablePagination>

Related Component

JavaScript errors detected

Please note, these errors can depend on your browser setup.

If this problem persists, please contact our support.