Wicket - Tree +

Question

我是wicket和jquery的新手，我希望我的wicket页面中有一棵简单的树，链接到。(“简单”，我指的是一个词根，有些孩子可能是孩子，.)。

每个节点都包含一个带有其名称和一些链接或按钮的标签。

我发现的一切看起来都很难..。我喜欢“RecursivePanel”这个例子，但我无法让它与jquery一起工作。

你对下面的解决方案有什么看法？我不太喜欢分裂成两个组件的事实，但我没有找到任何好的解决方案。

因此，该树由两个组件组成。

• NodePanel，其中包含节点的名称和NodeChildrenPanel。
• NodeChildrenPanel，包含一个标签，如果它是一个叶或一个NodePanel再次为每个孩子。

NodePanel.html

<wicket:panel>
  <li>
    <span wicket:id="name"></span>
    <span wicket:id="children"></span>
  </li>
</wicket:panel>

NodePanel.java

class NodePanel extends Panel {
    Node(String id, Node node) {
        super(id);

        setRenderBodyOnly(true);

        add(new Label("name", node.getName()));
        add(new NodeChildrenPanel("children", node));
    }
}

NodeChildrenPanel.html

<wicket:panel>
  <ul>
    <li wicket:id="children"></li>
  </ul>
</wicket:panel>

NodeChildrenPanel.java

class NodeChildrenPanel extends Panel {
    public NodeChildrenPanel(String id, Node node) {
        super(id);

        setRenderBodyOnly(true);

        if (node.isLeaf()){
            Label l = new Label("children");
            l.setVisible(false);
            add(l);
        } else {
            RepeatingView rv = new RepeatingView("children");

            for (Node child : node.getChildren()){
                if (child.isLeaf()){
                        rv.add(new Label(rv.newChildId(), child.getName()));
                } else {
                        rv.add(new NodePanel(rv.newChildId(), child));
                }
            }

            add(rv);
        }       
 }

}

在那页里，

根节点被创建为

 <ul id="my_tree_ul">
    <div wicket:id="my_tree"></div>
 </ul>

add(new NodePanel("my_tree", getSession().getMyRootNode());

并链接到。

public void renderHead(IHeaderResponse response) {
    String js = "$(document).ready(function(){ $(\"#my_tree_ul\")
                     .treeview({animated: \"fast\",       
                          });
                 });");

    response.renderJavaScript(js, null);
}

有没有更好的解决办法？

Answer 1

我们使用由Treeg不但包提供的巫术扩展