-
FEATURED COMPONENTS
First time here? Check out the FAQ!
In ZK 7.X, when total width of columns exceeds the maximum width of a listbox, a horizontal scroll bar appears when you hover over the listbox. However this horizontal scroll bar hides the last row in the list. Is there a way to display the horizontal scroll bar without hiding the last row of the listbox? Thanks in advance!
Example:
<window title="listbox demo" border="normal" width="250px">
<listbox id="box">
<listhead sizable="true">
<listheader label="name" sort="auto" width="150px"/>
<listheader label="gender" sort="auto" width="150px"/>
</listhead>
<listitem>
<listcell label="Mary" />
<listcell label="FEMALE" />
</listitem>
<listitem>
<listcell label="John" />
<listcell label="MALE" />
</listitem>
<listitem>
<listcell label="Jane" />
<listcell label="FEMALE" />
</listitem>
<listitem>
<listcell label="Henry" />
<listcell label="MALE" />
</listitem>
<listfoot>
<listfooter>
<label value="This is footer1" />
</listfooter>
<listfooter>
<label value="This is footer2" />
</listfooter>
</listfoot>
</listbox>
</window>
I think it maybe due to change to the default value for nativebar in 7.0.2.
In 7.0.2 release note: "Due to the better user-friendly for the scrollbar layout, we changed the org.zkoss.zul.nativebar of the library property to true by default for Grid, Listbox, Tree and Borderlayout component."
You can try to change the property to true in zk.xml of your current ZK version.
<library-property>
<name>org.zkoss.zul.nativebar</name>
<value>true</value>
</library-property>
Hello blin,
Could you please give more information on your environment setup because i tested your code with ZK version 7.0.2 and it works correctly.
Furthermore is there a reason that you have defined your listheader widths and specifically with greater values than your window width? It is recommended to use percentages.
Best Regards,
Darksu
Hi Darksu,
Thank you for your response! I defined the listheader widths in absolute value order for the horizontal scroll bar to show, but looks like the problem can only be duplicated in our environment. We use ZK default breeze theme.
I compared this simple zul within our development environment vs. ZK Fiddle by using Breeze 7.0.2 and found some difference in style.
1) For z-listbox-body, our enviornment set it to "overflow:hidden", zk Fiddle set it to"overflow:auto"
2) Our environment has an extra element having zk-scrollbar / zk-scrollbar-horizonal style, zk Fiddle has no such element
Please click the following link for a screenshot to get a clearer view. http://picpaste.com/example-07hw4piq.png
Could you please advice on what might cause these differences?
Thanks in advance! Bing
Asked: 2014-11-18 17:25:39 +0800
Seen: 46 times
Last updated: Dec 02 '14