Board index JavaServer Faces General p:scrollPanel inside p:tabView

p:scrollPanel inside p:tabView

Components, Ajax Framework, Utilities and More.

Post 02 Apr 2012, 12:27

Posts: 2
Hallo,

is there a particular reason why I cannot get a scrollPanel work in the second, third, etc tab of a p:tabView, which is inside a p:dialog ?

<p:dialog modal="true" widgetVar="dlg">
<p:tabView ...>
<p:tab title="tab1">
<p:scrollPanel style="height: 530px; width: 860px;">
<ui:include src="./../pub/sections/file1.xhtml" />
</p:scrollPanel>
</p:tab>
<p:tab title="tab2">
<p:scrollPanel style="height: 530px; width: 860px;">
<ui:include src="./../pub/sections/file1.xhtml" />
</p:scrollPanel>
</p:tab>
<p:tab title="tab3">
<p:scrollPanel style="height: 530px; width: 860px;">
<ui:include src="./../pub/sections/file1.xhtml" />
</p:scrollPanel>
</p:tab>
</p:tabView>
</p:dialog>

I can get the vertical scroll bar only for the first tab.

The reason why I am trying that is because I want the tabs to remain visible while scrolling down.

Moreover, is there a way to reset the vertical scrollbar so that is starts always at the top?

Many thanks
Luca
Netbeans 7.1.1
Glassfish V3.1.2
PF 3.2


Posts: 2
Hallo,

for the time being I have solved my problem by specifying the mode as native for all scroll panels.

<p:dialog modal="true" widgetVar="dlg">
<p:tabView ...>
<p:tab title="tab1">
<p:scrollPanel mode="native" style="height: 530px; width: 860px;">
<ui:include src="./../pub/sections/file1.xhtml" />
</p:scrollPanel>
</p:tab>
<p:tab title="tab2">
<p:scrollPanel mode="native" style="height: 530px; width: 860px;">
<ui:include src="./../pub/sections/file1.xhtml" />
</p:scrollPanel>
</p:tab>
<p:tab title="tab3">
<p:scrollPanel mode="native" style="height: 530px; width: 860px;">
<ui:include src="./../pub/sections/file1.xhtml" />
</p:scrollPanel>
</p:tab>
</p:tabView>
</p:dialog>

It allows me to show a scroll panel each tab and to reset the vertical scrollbar everytime the user selects one of the tabs.

I have seen that PrimeFaces scroll panel sets some css properties dynamically but I was not able to understand whether it is possible to use some js functions to override that behaviour.

Regards
Luca
Netbeans 7.1.1
Glassfish V3.1.2
PF 3.2


Posts: 12
Native sucks :(

Isn't there still any other solution?


Posts: 14909
Location: Cybertron

Non-native ScrollPanel is experimental right now, once it becomes stable we'll apply it to any container that overflows like scrollable table, scrolling selectOneMenu and so on.
PrimeFaces Lead


Posts: 14
optimus.prime wrote:
Non-native ScrollPanel is experimental right now, once it becomes stable we'll apply it to any container that overflows like scrollable table, scrolling selectOneMenu and so on.

Could you possibly mention that as a 'known issue' in your demo or manual to save the users from wasting hours trying to get it to work?
There are a couple of inches of space at the end of scrollPanel section in the manual on p.360 where this little notice would fit perfectly.
PrimeFaces 3.5


Return to General