Multiple choice combobox

answered 2016-12-21 08:58:21 +0800

WilliamB
1609 ● 1 ● 6

In case it helps someone else, went with a readonly bandbox containing a listbox to do what I wanted.

On the zul side :

<bandbox id="myBandBox" width="135px" readonly="true">
    <bandpopup>
        <listbox id="myListBox" width="135px" height="60px" multiple="true" 
            checkmark="true" />
    </bandpopup>
</bandbox>

On the controler (MVC) side :

Retrieve the zul components

@Wire
private Bandbox myBandBox;
@Wire
private Listbox myListBox;

During initialization : 1 - add an event listener to open the bandbox even in readonly mode

myBandBox.addEventListener(Events.ON_CLICK, new EventListener<Event>() {
    @Override
    public void onEvent(Event arg0) throws Exception {
        myBandBox.setOpen(true);
    }
});

2 - fill the listbox with its listItems

3 - Add an event listener when checking the listITem

changeStatusListbox.addEventListener(Events.ON_SELECT, new EventListener<SelectEvent<Listitem, String>>() {
    @Override
    public void onEvent(SelectEvent<Listitem, String> event) throws Exception {
        // Generates the label you want to display
        StringBuilder labelToDisplaySB = new StringBuilde();
        // Business logic checking that if all is selected, you will only display "ALL" else you will display the listItem labels separated with a comma or whatever ...

        // Then set it as Value for the bandbox
        statusBandBox.setValue(labelToDisplaySB.toString());
        statusBandBox.setTooltiptext(statusBandBox.getValue());
    }
});