Zk scroll on listbox after listitem being remove

asked 2016-07-28 14:35:09 +0800

javiut gravatar image javiut flag of Venezuela, Bolivarian Republic of
90 1 5

I have a listbox which when a listitem is removed a scroll sometimes both vertical and horizontal appears. i have read this post http://tracker.zkoss.org/browse/ZK-1954 and gives me a workaround but nothing works here is the code

        <zscript>Object[] o = new Object[10];</zscript>
        <button id="btn" label="delete" onClick="deleteSelection();"/>
        <listbox id="list" width="300px" checkmark="true" multiple="true">
                     <label value="Column"/>
                <listitem forEach="${o}">
                     <listcell label="value"/>
                public void deleteSelection() {
                    for(Listitem item : list.getSelectedItems()) {

The link says that there is a hack or a workaround like this

  .no-scroll-bar .z-listbox-body {
   overflow: hidden;

I have added that to my code but doesn't work neither

Like this

   <style>.no-scroll-bar .z-listbox-body{overflow:hidden;}</style>

Stills the scrolls appears. i am using 6.5.2 build

INFO: Starting ZK 6.5.2 EE (build: 2013032614)

Any help? the only workaround i have found i set the model again to the listbox to render again but this maybe a performance issue i dont want to render all the listitems again...

Thanks a lot.

delete flag offensive retag edit

2 Answers

Sort by ยป oldest newest most voted

answered 2016-07-31 08:46:58 +0800

Darksu gravatar image Darksu
1991 1 4

Hello javiut,

I would follow the re-render path (Also please check using only notify change), since its proven to work as expected. Keep in mind that you can improve the performance of the listbox by following this documentation:


Best Regards,


link publish delete flag offensive edit


Can you give a (using only notify change) example thanks a lot

javiut ( 2016-08-01 12:37:11 +0800 )edit

answered 2016-08-20 05:55:23 +0800

Darksu gravatar image Darksu
1991 1 4

Hello javiut,

Please find a simple example:

    <window title="Search Storage Item" border="normal" width="600px"
        apply="org.zkoss.bind.BindComposer" viewModel="@id('vm') @init('pkg$.TestVM')" >

                <listbox model="@load(vm.items)" selectedItem="@bind(vm.selected)" rows="3" hflex="true" height="300px">
                        <listheader label="Name" width="80px"/>
                        <listheader label="Price" align="center" width="80px" />
                        <listheader label="Quantity" align="center" width="80px" />
                    <template name="model" var="item">
                        <listitem >
                                <label value="@load(item.name)" />
                                <intbox readonly="true" value="@load(item.price)" />
                                <intbox readonly="true" value="@load(item.quantity)" />
                <button onClick="@command('removeItem')" label="Remove Item" />


import java.util.*;

import org.zkoss.bind.annotation.Command;
import org.zkoss.bind.annotation.NotifyChange;
import org.zkoss.zul.*;

public class TestVM {
    private List<Item> _items;
    private Listitem _selected;
    public List<Item> getItems () {
        if (_items == null) {
            _items = new ArrayList();
            _items.add(new Item("Item 1", 1, 1));
            _items.add(new Item("Item 2", 2, 2));
            _items.add(new Item("Item 3", 3, 3));
                        _items.add(new Item("Item 4", 3, 3));
                        _items.add(new Item("Item 5", 3, 3));
                        _items.add(new Item("Item 6", 3, 3));
                        _items.add(new Item("Item 7", 3, 3));
                        _items.add(new Item("Item 8", 3, 3));
                        _items.add(new Item("Item 9", 3, 3));
                        _items.add(new Item("Item 10", 3, 3));
        return _items;

    public void setSelected (Listitem selected) {
        _selected = selected;
    public Listitem getSelected () {
        return _selected;

    @Command @NotifyChange("items")
    public void removeItem() {
          if (_items.size() > 0) {

package pkg$;

public class Item {
    private String _name;
    private int _price;
    private int _quantity;
    public Item () {

    public Item (String name, int price, int quantity) {
        setName (name);
        setPrice (price);
        setQuantity (quantity);
    public void setName (String name) {
        _name = name;
    public String getName () {
        return _name;
    public void setPrice (int price) {
        _price = price;
    public int getPrice () {
        return _price;
    public void setQuantity (int quantity) {
        _quantity = quantity;
    public int getQuantity () {
        return _quantity;
link publish delete flag offensive edit
Your answer
Please start posting your answer anonymously - your answer will be saved within the current session and published after you log in or create a new account. Please try to give a substantial answer, for discussions, please use comments and please do remember to vote (after you log in)!

[hide preview]

Question tools

1 follower



Asked: 2016-07-28 14:35:09 +0800

Seen: 33 times

Last updated: Aug 20 '16

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More