How can I surpress Scroll Bars in my Tabbed Interface?

[Fulltimer]

One of my tabbed panes is pretty crowded with data input "stuff". Most of the time I'm
okay but sometimes the tabbed pane shows vertical and horizontal scroll bars which
actually crowds my page even more.

How can I PREVENT the scroll bars from showing, even though it may "sense" that scroll
bars are needed. As the developer, "I" want to make that decision. I can't find
a property that will allow me to do this yet with all the hundreds of property elements
that A5 provides, I can't believe that this capability is not available.

Please do not recommend that I eliminate some of the items on the page. That doesn't
address the problem that I am trying to solve. Thanks!

[Davidk]

Re: How can I surpress Scroll Bars in my Tabbed Interface?

Get the ID of the tab pane you want to affect and then you can hide the scroll bar. I have a grid displayed in a tab pane... in that Grid's onGridRender Event I put...

$('tbi.PANE.1.PANE').style.overflow="hidden";

The overflow property of the Object's Style controls the scroll bars. Usually it's Auto, but you can decide what you like.

I think overflow controls both x and y bars. overflow-x and overflow-y look after their own bars.

[Fulltimer]

Re: How can I surpress Scroll Bars in my Tabbed Interface?

Get the ID of the tab pane you want to affect and then you can hide the scroll bar. I have a grid displayed in a tab pane... in that Grid's onGridRender Event I put...

$('tbi.PANE.1.PANE').style.overflow="hidden";

The overflow property of the Object's Style controls the scroll bars. Usually it's Auto, but you can decide what you like.

I think overflow controls both x and y bars. overflow-x and overflow-y look after their own bars.

David,

That was a wonderful solution but I am having one problem with it. My Tab1 is configured to open whenever the Tabbed Interface is opened. The "hidden" property works at that point. However if I call that same TAB1 from a button on the left hand side of my tabbed interface, the onDetailRender event does not seem to be called. The scroll bars reappear.

Any thoughts on why this odd behavior?

[Davidk]

Re: How can I surpress Scroll Bars in my Tabbed Interface?

Hey Tom,

My test TabUI wasn't opening a default tab... so I had to click a tab button from the tab menu. I put my scrollbar code into the Grid's onGridRender event. I added a 2nd tab to my test and I'm now opening Tab1 by default when the TabUI opens... The Tab1 scroll bar is gone, then I click on the 2nd tab control button and the 2nd tab opens, with a scroll bar. I click on the Tab1 tab and it displays - no scrollbar. I close Tab1, then click on the Tab1 button in the tab control to open tab1 again... no scrollbar. Not sure if it's your onDetailRender event... but try the onGridRender event. Not sure what else could be going on.

Hold on... A5 is assigning incremental numbers to the tab panes. Your default opening tab may be 1 when it's first opened... but if closed, and re-opened... it's a different number... going to look further.

[Davidk]

Re: How can I surpress Scroll Bars in my Tabbed Interface?

Yikes... this was a bit of a nasty one... because the Pane ID keeps changing... so... you have to go after the Pane you want... figure out what it's ID is... then use that ID to hide the scroll bars.

Thank goodness Andy Gill posted some great info here http://msgboard.alphasoftware.com/al...ghlight=tbiObj about the tab object... 'cause I just can't find any documentation on the tab object... at all.

Anyway...

Don't put any code into the Grid. Instead, get into your Tabbed UI and, on the Control Button where you've put your Grid, get into that Button's Tab Pane Javascript events. In the onChange event, put this...

var myIdx = tbiObj._tbObj._curTabIndx;
var myID = tbiObj._tbObj._panes[myIdx]._id;
var n=myID.lastIndexOf(".");
var curPane = myID.substr(n+1,myID.length-n)
$('tbi.PANE.' + curPane + '.PANE').style.overflow="hidden";

Get the index of the tab you're on. The index is always relative to where the tab is... so that's good.
Get the ID of that Index. The ID of the tab is always incremented. If you're working with your Tabbed UI, opening and closing tabs... for hours... you could have an ID of 100 for a 3 tab tabbed UI... wild.
The ID will be in the form of tbi.PANE.n where n is a next consecutive number.
Get the current Pane #
Hide the scroll bars of the current pane #

I would love to know how to find the docs on the tab object... all the tbiObj stuff.

[Fulltimer]

Re: How can I surpress Scroll Bars in my Tabbed Interface?

David,

Thanks sooooooooooo much!

All I can say is WOW! I would have never worked that out as "the" solution even if my life were on the line. If I go slow enough I can make some sense of what's going on in the code but "%$#$#"! How is a normal human being supposed to figure that out?
Either the programmers at Alpha are just at such a higher playing level (compared than us) and assume this type stuff is "obvious" or they simply don't care that most of us will ever get it.

I too wish there was some definitive guide that would expose things like the tab object but we've been wishing for such documentation for years and never seem to get it. I think the company is solely interested in making new sales by adding new features.