JSF + Dynatree 制作树表示

Question

我想画一棵在 JSF 中生成的树。

我认为我应该使用 DynaTree 并避免使用组件库，尽管看到解决方案的复杂性我开始重新考虑。

我想我可以使用 Javascript 的隐藏输入传递树的字符串表示形式，然后在那里构建树。

有没有我没有想到的更好的解决方案？

使用JSF2.0

Answer 1

我最终所做的是生成一个表示树的 JSON 字符串（以 dynatree 格式），然后在另一端（浏览器）简单地使用 JSON.Parse() 来生成一棵树。

相关代码是：
Java 树节点：

class GroupTreeNode {
   public getNodes();
   public getGroupId();
   public getName();
}

生成树字符串：

public String generateTreeString()
{
    GroupTreeNode[] root = getGroupTreeBean()
            .getGroupsTreeRoot("groupTree");

    StringBuilder sb = new StringBuilder();

    sb.append("[");

    for (int i = 0; i < root.length; i++)
    {
        genSubTree(root[i], sb);
    }

    sb.append("]");

    return sb.toString();
}

private void genSubTree(GroupTreeNode node, StringBuilder sb)
{
    // Check if the last character is a '}' in which case we need to add a comma
    char[] chararray = new char[1];
    sb.getChars(sb.length()-1, sb.length(), chararray, 0);
    if (chararray[0] == '}') {
        sb.append(", ");
    }

    // Carry on...
    sb.append("{");

    // Group Name
    sb.append("\"title\":\"");
    sb.append(node.getName());
    sb.append("\", ");

    // Group ID (Custom Node Tab)
    sb.append("\"groupID\":\"");
    sb.append(node.getGroupId());
    sb.append("\"");

    // Children (Only if applicable)
    if (node.getNodes().length > 0) {
        sb.append(", \"isFolder\":true, \"children\":[");
        for (int i =0; i < node.getNodes().length; i++)
        {
            genSubTree(node.getNodes()[i], sb);             
        }

        sb.append("]");
    }

    sb.append("}");
}

该字符串通过 JSF 传递到 ，然后是 JavaScript 解析：

    function buildTree(sTree) {
        var builtobj = JSON.parse(sTree);
        return builtobj;
    }


    var jsfString = $("#tree").val();
    console.log("Building a tree with:" + jsfString);

    $("#fleet_tab_tree").dynatree({
        onActivate : function (node) {
            console.log("You activated " + node.data.title + ", with groupID=" + node.data.groupID);
            // Do whatever you want with the node values
        },
        persist : true,
        children : buildTree(jsfString),
        clickFolderMode: 1
    });

Answer 2

我同意你的观点，dynatree 是一个强大且经过验证的组件。相反，一些 JSF 原生树组件的功能较少。

我已经启动了 dynatree 的适配器。你可以在这里找到源代码 https://github.com/nithril/dynatree-for-jsf

欢迎评论！