I can't work out why my Table has a horizontal scrollbar with the ability to scroll to the right, when my last column ends 4/5th the way along the horizontal width?
Strangely, if the table height is increased to show all rows, then the vertical scrollbar greys out and doesn't let you scroll anymore:
Any ideas how to fix this for when the height doesn't show all rows?
I know I probably need to copy in the json here to make it easier to diagnose... I'll see what I can do later
EDIT:
The issue only occurs when the Table's props.data property is bound. Removing the binding removes the unnecessary horizontal scrollbar, despite the actual data not changing.
I remember seeing this problem before. I think it was related to the container the table was in. Show us the Project Browser view structure.
This is what I got:
However, even if I move it to almost the root, it still has the horz scrollbar:
And into the root itself:
Copying the table into a completely new View fixes it... in this process I had to remove the binding on the props.data since the references were gone. It seems this is what actually fixed it, as removing the binding in the actual View fixes it there too. Strange
As soon as I add the binding back, which doesn't actually change the data, I get the horz scrollbar back....
2 Likes
As a workaround, I've removed the binding and used a custom prop change event script to update the props.data instead 
Edit:
Wait... this fixed by original table, but didn't fix another table within the same flex. I copied the fixed one and pasted it into the flex, and the copied one still has the horizontal scrollbar?? I'm very confused
What is your overflow setting? I have had some luck fixing issues by setting this to hide instead of auto.
Frank
I've tried hidden everywhere I can find in the Table styles (and the flex container, but this shouldn't affect the Table's body)
But the fact that the same table copied into the same column flex (if it were a row flex it might be a different story), where one has a scrollbar and the other doesn't, indicates to me that it's more a bug than configuration
Yes. Agreed. That seems buggy to me as well. I will keep an eye on this post hoping you get an explanation. I use a lot of table components in the applications I am developing.
Update:
If I turn off props.virtualised, the problem is there. If I turn it on, it goes away. However no matter how hard I try, I can't produce the issue in a reproducible way. It displays correctly in my standalone test View.
However, I need to have virtualised off, as without it the mouse cursor becomes out of synch with the position of the scrollbar thumb (a separate bug).
This doesn't affect the table at the top - this one is set to virtualised off and it's displaying correctly!!
2 Likes
I've endured this issue with the horizontal scroll bar in tables for ages. Similar scenario - virtualized off due to scroll issues, data property bound to a script running every second. I only see it in a client, never the designer.
To me it looks like a re-draw problem (or lack of) - the data produces enough rows to trigger the vertical scroll bar and the vertical scroll bar triggers the horizontal scroll bar to display. A few different events can make the horizontal scroll bar disappear:
- show/hide a subview in the table
- show/hide a dock that pushes content
- resize the browser window
It's become an OCD item for me and drives me nuts, lol.
A number of Ignition 8.1.x versions ago, having a column render a View was sufficient to make this disappear; but this stopped after rendering performance improvements were implemented at one point.
Only solution I've found now is to bind a custom property and use a Change Script to write it to the data property.
1 Like
Same problem here. Thank you for the hint with the virtualized property, this resolved it in my case. But it is definitely an annoying bug / behavior. 
