Question

onSelect事件仅适用于该组件，我只想显示/隐藏所选复选框的组合框。

这是我的zul文件供参考

![<?page title="MVVM Tree POC"?>
<zk>
    <borderlayout height="800px">
        <west size="25%"></west>
        <center>
            <window apply="org.zkoss.bind.BindComposer"
                viewModel="@id('vm') @init('com.nagarro.viewmodel.TreeViewModel')"
                title="Dynamic Tree" border="normal">
                <tree checkmark="true" model="@bind(vm.treeModel)"
                    onSelect="@command('select')">
                    <treecols>
                        <treecol label="Name" align="center" />
                        <treecol label="Value" align="center" />
                        <treecol label="IP" align="center" />
                    </treecols>
                    <template name="model" var="node" status="s">
                        <treeitem checkable="@load(node.checkable)">
                            <treerow style="text-align:center;">
                                <treecell
                                    label="@bind(node.data.firstName)" style="text-align:left;">

                                </treecell>
                                <treecell style="text-align:center;">
                                    <combobox>
                                        <comboitem label="Fixed" />
                                        <comboitem label="System" />
                                        <comboitem label="Parameter" />
                                    </combobox>
                                </treecell>
                                <treecell style="text-align:center;">
                                    <combobox>
                                        <comboitem label="IP" />
                                    </combobox>
                                </treecell>
                            </treerow>

                        </treeitem>
                    </template>
                </tree>

            </window>
        </center>
    </borderlayout>
</zk>]

snapshot of the issue 在图像中，我想仅显示已选中复选框的组件的组合框。没有复选框或未选中复选框，组件不应显示任何组合框。谢谢

这是mvvm文件

public class TreeViewModel {


    private Request request;
    private AdvancedTreeModel treeModel;

    /**
     * @return the treeModel
     */
    public AdvancedTreeModel getTreeModel() {
        if(treeModel == null){
            TreeNode<Tree> treeNode = new TreeList(request).getRoot();
            treeModel = new AdvancedTreeModel(treeNode);
            treeModel.setMultiple(true);
        }
        return treeModel;
    }

    /**
     * @param treeModel the TreeModel to set
     */
    public void setTreeModel(AdvancedTreeModel treeModel) {
        this.treeModel = treeModel;
    }
    @Init
    public void init(){
        try {
            File file = new File("C:\\Users\\jatin1937\\Desktop\\XML files\\Request.xml");
            JAXBContext jaxbContext = JAXBContext.newInstance(Request.class);
            Unmarshaller jaxbUnmarshaller = jaxbContext.createUnmarshaller();
            request = (Request) jaxbUnmarshaller.unmarshal(file);
        }catch (JAXBException e) {
            e.printStackTrace();
        }
    }

    /**
     * @return the request
     */
    public Request getRequest() {
        return request;
    }

    /**
     * @param request the request to set
     */
    public void setRequest(Request request) {
        this.request = request;
    }
    @Command
    public void select(){
        System.out.println("onSelect method entered");
    }
}

树数据是通过一些辅助类准备的，但这里描述并不重要。

Answer 1

我也试过了，找到了出路。现在，我没有在onSelect组件上使用tree事件，而是在onClick组件上使用treeRow事件。我在我的班级中保留了一个字段isChecked，该字段由zul文件中的node.data引用。根据布尔值isChecked的值，我显示/隐藏组合框。

以下是供参考的zul文件

<?page title="MVVM Tree POC"?>
<zk>
    <borderlayout height="800px">
        <west size="25%"></west>
        <center>
            <window apply="org.zkoss.bind.BindComposer"
                viewModel="@id('vm') @init('com.nagarro.viewmodel.TreeViewModel')"
                title="Dynamic Tree" border="normal">
                <tree checkmark="true" model="@bind(vm.treeModel)">
                    <template name="model" var="node" status="s">
                        <treeitem
                            checkable="@load(node.data.isCheckable)" open="true">
                            <treerow style="text-align:center;"
                                onClick="@command('select', treeNode = node.data)">
                                <treecell
                                    label="@bind(node.data.firstName)" style="text-align:left;">
                                </treecell>
                                <treecell style="text-align:center;"
                                    if="${node.data.isChecked == true}">
                                    <combobox>
                                        <comboitem label="Fixed" />
                                        <comboitem label="System" />
                                        <comboitem label="Parameter" />
                                    </combobox>
                                </treecell>
                                <treecell style="text-align:center;"
                                    if="${node.data.isChecked == true}">
                                    <combobox>
                                        <comboitem label="Fixed" />
                                        <comboitem label="System" />
                                        <comboitem label="Parameter" />
                                    </combobox>
                                </treecell>
                            </treerow>
                        </treeitem>
                    </template>
                </tree>

            </window>
        </center>
    </borderlayout>
</zk>

以下是ViewModel中的select方法以供参考

@NotifyChange("treeModel")
@Command
public void select(@BindingParam("treeNode") final Tree tree){
    if(tree.getIsCheckable()){
        if(tree.getIsChecked() == true){
            tree.setIsChecked(false);
        }else{
            tree.setIsChecked(true);
        }
    }

}

请注意 Tree 是一个自定义类，我通过它来准备树数据。 isCheckable 也是 Tree 类中的 boolean 字段。如果 true 然后复选框将出现在 treeRow 中。 isChecked 是 Tree 类中的另一个 Boolean 字段。如果 true 那么选中相应的复选框，否则

Answer 2

就这样做吧

<tree onSelect="@command('select', tree=self)" >

并在您的虚拟机

中

Set<Treeitem> oldSelection;
...

@Command
public void select(@BindingParam("tree")Tree tree){
   // delete
   Set<Treeitem> unselected = oldSelected.removeAll(tree.getSelectedItems());
   for(Treeitem x : unselected){
       x.getTreerow().getLastChild().setParent(null);
   }
   // add
   tree.getSelectedItem().getTreerow().appendChild(getCombobox());
   oldSelection = tree.getSelectedItems()
}

在选择树的复选框时显示/隐藏组件

2 个答案: