PR #500, point 9: Add pagination attribute.

examples/table_and_slots/main.py

@@ -26,7 +26,7 @@ def remove_row(keys):
             del rows[i]
             table.update()
 
-with ui.qtable(title='QTable', columns=fields, rows=rows, key='id', selection='single') as table:
+with ui.qtable(title='QTable', columns=fields, rows=rows, key='id', selection='single', pagination=15) as table:
     with table.add_slot('top-right'):
         with ui.input(placeholder='Search').props('type="search"').bind_value(table, 'filter') as search:
             with search.add_slot('append'):

nicegui/elements/table.py

@@ -35,6 +35,7 @@ class QTable(FilterElement):
             key: str,
             title: Optional[str] = None,
             selection: Optional[Literal['single', 'multiple', 'none']] = 'none',
+            pagination: Optional[int] = 0,
     ) -> None:
         """QTable
 
@@ -44,10 +45,11 @@ class QTable(FilterElement):
         :param rows: A list of row objects.
         :param key: The name of the column containing unique data identifying the row.
         :param title: The title of the table.
-        :param selection: defines the selection behavior.
+        :param selection: defines the selection behavior (default= 'none').
             'single': only one cell can be selected at a time.
             'multiple': more than one cell can be selected at a time.
             'none': no cells can be selected.
+        :param pagination: defines the number of rows per page. Explicitly set to None to hide pagination (default = 0).
 
         If selection is passed to 'single' or 'multiple', then a `selected` property is accessible containing
               the selected rows.
@@ -60,6 +62,13 @@ class QTable(FilterElement):
         self._props['row-key'] = key
         self._props['title'] = title
 
+        if pagination is None:
+            self._props['hide-pagination'] = True
+            pagination = 0
+        self._props['pagination'] = {
+            'rowsPerPage': pagination
+        }
+
         self.selected: list = []
         self._props['selected'] = self.selected
         self._props['selection'] = selection

website/reference.py

@@ -306,7 +306,7 @@ To overlay an SVG, make the `viewBox` exactly the size of the image and provide
             {'name': 'Carol'},
         ]
 
-        ui.qtable(columns=fields, rows=data, key='name', selection='none').props('hide-pagination').classes('w-full')
+        ui.qtable(columns=fields, rows=data, key='name', pagination=None).classes('w-full')
 
     @example(ui.chart, menu)
     def chart_example():