如何根据zk中的另一个组合框值过滤一个组合框值？

Question

我有一个包含两个组合框的列表。我在组合框1和组合框2中有一些值。在组合框1中选择项目时，值将在组合框2中过滤并在UI中呈现。

请有人帮忙解决这个问题。

Answer 1

关于如何做到这一点，MVVM中的zk小提琴有一个很好的例子。

You can find it here.

如果链接死亡，则代码为：

祖尔：

<zk>

<window border="normal" title="Dependent components" apply="org.zkoss.bind.BindComposer" 
        viewModel="@id('vm') @init('pkg$.DependencyViewModel')">

    <checkbox checked="@bind(vm.infoFromComboboxesRequired)" label="require comboboxes ?" 
        onCheck="@command('flagChecked')"/>

    <combobox model="@load(vm.comboModel1)" visible="@load(vm.infoFromComboboxesRequired)"
            selectedItem="@bind(vm.comboValue1)" onSelect="@command('combo1Selected')">
        <template name="model">
            <comboitem label="@load(each)" value="@load(each)"/>
        </template>
    </combobox>

    <combobox model="@load(vm.comboModel2)" visible="@load(vm.infoFromComboboxesRequired)"
            selectedItem="@bind(vm.comboValue2)" onSelect="@command('combo2Selected')">
        <template name="model">
            <comboitem label="@load(each)" value="@load(each)"/>
        </template>
    </combobox>

</window>

</zk>

视图模型：

import org.zkoss.bind.annotation.Command;
import org.zkoss.bind.annotation.Init;
import org.zkoss.bind.annotation.NotifyChange;
import org.zkoss.zk.ui.util.Clients;
import org.zkoss.zul.ListModel;
import org.zkoss.zul.ListModelList;

public class DependencyViewModel {

    boolean infoFromComboboxesRequired = false;

    ListModelList<String> comboModel1;
    ListModelList<String> comboModel2;

    String comboValue1;
    String comboValue2;

    @Init
    public void init() {
        comboModel1 = new ListModelList<String>();
        comboModel2 = new ListModelList<String>();
    }

    @Command("flagChecked")
    @NotifyChange({"comboModel1", "comboModel2"})
    public void onFlagChecked() {
        comboModel1.clear();
        comboModel2.clear();
        comboValue1 = null;
    }

    @Command("combo1Selected")
    @NotifyChange("comboModel2")
    public void onCombo1Selected() {
        comboModel2.clear();
    }

    @Command("combo2Selected")
    @NotifyChange("comboModel2")
    public void onCombo2Selected() {
        Clients.showNotification("selected combo 2 : " + comboValue2);
    }

    public ListModel<String> getComboModel1() {
        if(infoFromComboboxesRequired) {
            comboModel1.add("aaaa");
            comboModel1.add("bbbb");
            comboModel1.add("cccc");
            comboModel1.add("dddd");
            comboModel1.add("eeee");
        }
        return comboModel1;
    }

    public ListModel<String> getComboModel2() {
        if(infoFromComboboxesRequired && comboValue1 != null) {
            comboModel2.add(this.comboValue1 + "1111");
            comboModel2.add(this.comboValue1 + "2222");
            comboModel2.add(this.comboValue1 + "3333");
            comboModel2.add(this.comboValue1 + "4444");
            comboModel2.add(this.comboValue1 + "5555");
        }
        return comboModel2;
    }

    public boolean isInfoFromComboboxesRequired() {
        return infoFromComboboxesRequired;
    }

    public void setInfoFromComboboxesRequired(boolean infoFromComboboxesRequired) {
        this.infoFromComboboxesRequired = infoFromComboboxesRequired;
    }

    public String getComboValue1() {
        return comboValue1;
    }

    public void setComboValue1(String comboValue1) {
        this.comboValue1 = comboValue1;
    }

    public String getComboValue2() {
        return comboValue2;
    }

    public void setComboValue2(String comboValue2) {
        this.comboValue2 = comboValue2;
    }
}