# Automated Table Pagnation

**URL:** <https://forum.inductiveautomation.com/t/automated-table-pagnation/81174>\
**Category:** Ignition\
**Tags:** perspective, scripting\
**Created:** [October 30, 2023, 4:19pm UTC](https://forum.inductiveautomation.com/t/automated-table-pagnation/81174 "2023-10-30T16:19:06Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![Aisha\_Shiddat](https://avatars.discourse-cdn.com/v4/letter/a/45deac/32.png) [@Aisha\_Shiddat](https://forum.inductiveautomation.com/u/Aisha_Shiddat)\
**Post date:** [October 30, 2023, 4:19pm UTC](https://forum.inductiveautomation.com/t/automated-table-pagnation/81174/1 "2023-10-30T16:19:06Z")

</div>

Is it possible to create automated pagnation for table data without using the carousel??

---

<div class="post-metadata">

**Author:** ![cmallonee](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/cmallonee/32/6416_2.png) [@cmallonee](https://forum.inductiveautomation.com/u/cmallonee)\
**Post date:** [October 30, 2023, 4:42pm UTC](https://forum.inductiveautomation.com/t/automated-table-pagnation/81174/2 "2023-10-30T16:42:37Z")

</div>

Yes, but it's not as clear-cut as you'd think. Really, you just need to update the `Table.props.pager.activePage` prop.

I recommend a binding with a transform, like so:

 ![Screenshot 2023-10-30 at 9.29.08 AM](https://us1.discourse-cdn.com/inductiveautomation/original/3X/b/f/bfd873f4818b93dc31ad03a38436ba6aa3e95986.png)

BUT... you'll notice this will just increment forever, which is going to cause problems once you've exceeded the count of pages. Unfortunately, there's no way to know how many pages are currently being displayed. You can _force_ a number of pages based on your data, but you'll have to prevent a user from ever modifying the count of rows displayed.

Set the following props:

```auto
Table.props.pager.top = False
Table.props.pager.bottom = False # maybe not - see `Edit` below vvv
Table.props.pager.initialOption = <some_value>

```

Now, modify the original transform:

```auto
return (self.props.pager.activePage) % (len(self.props.data) // self.props.pager.initialOption) + 1

```

If you have a requirement to display the active page number, you could always leave `Table.props.pager.activePage` enabled, and just hide the row count dropdown with some CSS:

```auto
div.size-options {
    display: none;
}

```

Be forewarned that the locator I provided here is generic enough to apply to ALL tables in your project, and is therefore unsafe. You should apply a unique ID to `Table.meta.domId`, and target that:

```auto
#my-unique-table-id div.size-options {
    display: none;
}

```

**Edit** : it looks like turning both pagers to off (`display: false`) results in no pagination at all. That's less than desirable. You can still manage this by leaving either enabled and just setting `Table.props.pager.style.display` to `none`.

---

<div class="post-metadata">

**Author:** ![Aisha\_Shiddat](https://avatars.discourse-cdn.com/v4/letter/a/45deac/32.png) [@Aisha\_Shiddat](https://forum.inductiveautomation.com/u/Aisha_Shiddat)\
**Post date:** [October 31, 2023, 12:26am UTC](https://forum.inductiveautomation.com/t/automated-table-pagnation/81174/3 "2023-10-31T00:26:01Z")

</div>

Thanks that worked. Is the advanced stylesheet no longer accessible from Perspective?  
[Style Classes - Ignition User Manual 8.1 - Ignition Documentation](https://docs.inductiveautomation.com/display/DOC81/Style+Classes). Is there another way to access it?

---

<div class="post-metadata">

**Author:** ![cmallonee](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/cmallonee/32/6416_2.png) [@cmallonee](https://forum.inductiveautomation.com/u/cmallonee)\
**Post date:** [October 31, 2023, 12:35am UTC](https://forum.inductiveautomation.com/t/automated-table-pagnation/81174/4 "2023-10-31T00:35:19Z")

</div>

What version are you using for development?

---

<div class="post-metadata">

**Author:** ![Aisha\_Shiddat](https://avatars.discourse-cdn.com/v4/letter/a/45deac/32.png) [@Aisha\_Shiddat](https://forum.inductiveautomation.com/u/Aisha_Shiddat)\
**Post date:** [October 31, 2023, 12:57am UTC](https://forum.inductiveautomation.com/t/automated-table-pagnation/81174/5 "2023-10-31T00:57:26Z")

</div>

I'm using Designer Version 1.1.32

---

<div class="post-metadata">

**Author:** ![cmallonee](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/cmallonee/32/6416_2.png) [@cmallonee](https://forum.inductiveautomation.com/u/cmallonee)\
**Post date:** [October 31, 2023, 1:04am UTC](https://forum.inductiveautomation.com/t/automated-table-pagnation/81174/6 "2023-10-31T01:04:08Z")

</div>

If you right-click the Styles directory, there should be an option to enable the Advanced Stylesheet.

---

<div class="post-metadata">

**Author:** ![Aisha\_Shiddat](https://avatars.discourse-cdn.com/v4/letter/a/45deac/32.png) [@Aisha\_Shiddat](https://forum.inductiveautomation.com/u/Aisha_Shiddat)\
**Post date:** [October 31, 2023, 1:31am UTC](https://forum.inductiveautomation.com/t/automated-table-pagnation/81174/7 "2023-10-31T01:31:34Z")

</div>

Yep, I tried that, but the only options are New Class or New Folder. The Advanced Stylesheet option isnt there for some reason...there may be some additional settings that I need to configure???

---

<div class="post-metadata">

**Author:** ![avaughn](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/avaughn/32/38972_2.png) [@avaughn](https://forum.inductiveautomation.com/u/avaughn)\
**Post date:** [October 31, 2023, 1:18pm UTC](https://forum.inductiveautomation.com/t/automated-table-pagnation/81174/8 "2023-10-31T13:18:45Z")

</div>

What's your gateway version?

---

<div class="post-metadata">

**Author:** ![Aisha\_Shiddat](https://avatars.discourse-cdn.com/v4/letter/a/45deac/32.png) [@Aisha\_Shiddat](https://forum.inductiveautomation.com/u/Aisha_Shiddat)\
**Post date:** [October 31, 2023, 5:14pm UTC](https://forum.inductiveautomation.com/t/automated-table-pagnation/81174/9 "2023-10-31T17:14:28Z")

</div>

8.1.32

---

<div class="post-metadata">

**Author:** ![cmallonee](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/cmallonee/32/6416_2.png) [@cmallonee](https://forum.inductiveautomation.com/u/cmallonee)\
**Post date:** [October 31, 2023, 5:49pm UTC](https://forum.inductiveautomation.com/t/automated-table-pagnation/81174/10 "2023-10-31T17:49:12Z")

</div>

It should be visible. If it's not, you should reach out to Support.

![Screenshot 2023-10-31 at 10.48.41 AM](https://us1.discourse-cdn.com/inductiveautomation/original/3X/b/7/b796601f087f5718262c31395f06768782e6bf56.png)
