# Overflow perspective table data to a new column

**URL:** <https://forum.inductiveautomation.com/t/overflow-perspective-table-data-to-a-new-column/89430>\
**Category:** Ignition\
**Tags:** database, perspective, ignition81\
**Created:** [April 25, 2024, 6:58am UTC](https://forum.inductiveautomation.com/t/overflow-perspective-table-data-to-a-new-column/89430 "2024-04-25T06:58:18Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![Craig\_Simpson](https://avatars.discourse-cdn.com/v4/letter/c/e56c9b/32.png) [@Craig\_Simpson](https://forum.inductiveautomation.com/u/Craig_Simpson)\
**Post date:** [April 25, 2024, 6:58am UTC](https://forum.inductiveautomation.com/t/overflow-perspective-table-data-to-a-new-column/89430/1 "2024-04-25T06:58:18Z")

</div>

Ignition Perspective 8.1.

I currently have a web dashboard showing at various locations in the factory. It is built on Bootstrap 4 and shows all the first aid personnel in three categories: on-site at building 1, on-site at building 3 and offsite. This is a non-interactive page.  
To handle displaying a dynamically changing amount of names in each category I currently use JavaScript to find the height of each row a single name is in. When the rows accumulate if the total height of all the rows reaches a percentage of the screen viewing height then add a new column to the right to populate with the overflow of names.  
I am now bringing all factory dashboards into Ignition.  
I have a query tag for each of the three categories returning a dataset - and bind to each table, each in a flex container, but obviously as standard the accumulating rows overflow off the bottom of the page. Each table only has 1 column and up to 120 rows.  
I am fairly new to Ignition but to get the list of names to start a new column to the right every time the page length is reached I’d have to put a script transform on the bound dataset and loop through doing a media query each time, then add a new column to the table. (Or creating a new dataset every time the page length has been reached? )  
This feels it’s maybe excessive due to my own lack of experience?  
I would appreciate a better way to achieve this if anyone has any advice? Is a table even the best component? Planned direction of population of names shown in attached screenshot.  
Regards.  
Craig.

 ![ignition_fa](https://us1.discourse-cdn.com/inductiveautomation/original/3X/c/6/c6dfa20636796b333254993a1407b7d49a6b514e.png)

---

<div class="post-metadata">

**Author:** ![pturmel](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pturmel/32/3295_2.png) [@pturmel](https://forum.inductiveautomation.com/u/pturmel)\
**Post date:** [April 25, 2024, 12:16pm UTC](https://forum.inductiveautomation.com/t/overflow-perspective-table-data-to-a-new-column/89430/2 "2024-04-25T12:16:15Z")

</div>

Consider just using a fixed number of rows. Transform your source data by rows groups of that size, then construct a fresh dataset with columns for each group. Let the last group be padded with nulls.

There are some python iterator tricks that would help, but I'm drawing a blank. I'll look it up later if someone doesn't beat me to it.

---

<div class="post-metadata">

**Author:** ![Craig\_Simpson](https://avatars.discourse-cdn.com/v4/letter/c/e56c9b/32.png) [@Craig\_Simpson](https://forum.inductiveautomation.com/u/Craig_Simpson)\
**Post date:** [April 25, 2024, 2:52pm UTC](https://forum.inductiveautomation.com/t/overflow-perspective-table-data-to-a-new-column/89430/3 "2024-04-25T14:52:15Z")

</div>

Thank you Sir, I will look into this.

---

<div class="post-metadata">

**Author:** ![YF129701](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/yf129701/32/60498_2.png) [@YF129701](https://forum.inductiveautomation.com/u/YF129701)\
**Post date:** [April 25, 2024, 4:01pm UTC](https://forum.inductiveautomation.com/t/overflow-perspective-table-data-to-a-new-column/89430/4 "2024-04-25T16:01:59Z")

</div>

A picture would be very helpful to see what you're talking about. Just remove or blur information you don't want to be public

---

<div class="post-metadata">

**Author:** ![Craig\_Simpson](https://avatars.discourse-cdn.com/v4/letter/c/e56c9b/32.png) [@Craig\_Simpson](https://forum.inductiveautomation.com/u/Craig_Simpson)\
**Post date:** [April 26, 2024, 8:04am UTC](https://forum.inductiveautomation.com/t/overflow-perspective-table-data-to-a-new-column/89430/5 "2024-04-26T08:04:01Z")

</div>

Original post edited to show planned direction of names to be populated in table, in flex container.

---

<div class="post-metadata">

**Author:** ![MSviga](https://avatars.discourse-cdn.com/v4/letter/m/3e96dc/32.png) [@MSviga](https://forum.inductiveautomation.com/u/MSviga)\
**Post date:** [April 26, 2024, 10:47am UTC](https://forum.inductiveautomation.com/t/overflow-perspective-table-data-to-a-new-column/89430/6 "2024-04-26T10:47:22Z")

</div>

Consider using a flex repeater instead of a table. Be sure to set:  
`props.direction` = column,  
`props.wrap` = wrap,  
`props.justify` = flex-start,  
`props.alignContent` = flex-start.

I did a quick test and seems to work the way you want it to. I also took another look at the table component and im not sure there is an easy way to do what you want to do.

---

<div class="post-metadata">

**Author:** ![Craig\_Simpson](https://avatars.discourse-cdn.com/v4/letter/c/e56c9b/32.png) [@Craig\_Simpson](https://forum.inductiveautomation.com/u/Craig_Simpson)\
**Post date:** [April 29, 2024, 9:15am UTC](https://forum.inductiveautomation.com/t/overflow-perspective-table-data-to-a-new-column/89430/7 "2024-04-29T09:15:35Z")

</div>

I have used repeaters before for when I require a lot more instances, so I will look into this. So, are you saying not to use the table component in the "master" before spawning my three instances? What component would be suitable for the text binding? A label?

---

<div class="post-metadata">

**Author:** ![MSviga](https://avatars.discourse-cdn.com/v4/letter/m/3e96dc/32.png) [@MSviga](https://forum.inductiveautomation.com/u/MSviga)\
**Post date:** [April 30, 2024, 6:30am UTC](https://forum.inductiveautomation.com/t/overflow-perspective-table-data-to-a-new-column/89430/8 "2024-04-30T06:30:05Z")

</div>

Yeah I just made a flex view and set up an input parameter then bound it to a label that fills up the whole view, I believe I set the hight to like 32 and width to 100-200.
