如何在PrimeFaces TreeTable中选择全部? [英] How to select all in PrimeFaces TreeTable?

问题描述

我有一个PrimeFaces树表，想添加一个复选框，允许用户选择/取消选择全部.

I have a PrimeFaces tree table and would like to add a check box which allows the user to select/unselect all.

这是我的xhtml的摘录

Here is an extract from my xhtml

<p:selectBooleanCheckbox
        itemLabel="Select all"                                      
        value="#{mainViewBean.selectAll}">
        <p:ajax listener="#{mainViewBean.onSelectAll}"
            update="@this :mainForm" />
    </p:selectBooleanCheckbox>  

    <p:treeTable id="treeToAssign"
        value="#{mainViewBean.treeValue}" var="vh"
        selectionMode="checkbox"
        selection="#{mainViewBean.treeSelection}">
        <f:facet name="header">
            Tree Table                                                  
        </f:facet>                                                              
        <p:column>                                      
            <h:outputText value="#{vh.name}" />
        </p:column>                                 
    </p:treeTable>

这是我的bean方法

private TreeNode treeValue;
private TreeNode[] treeSelection;
private boolean selectAll;

public void onSelectAll() {             
    List<TreeNode> selection = new ArrayList<>();
    for (TreeNode node : treeValue.getChildren()) {
    node.setSelected(selectAll);
        selection.add(node);
    }

    treeSelection = selection.toArray(new TreeNode[selection.size()]);
}

起初我只是尝试设置NODE.setSelected(selectAll);，但这没有用，所以我也尝试手动填充treeSelection.

I had initially tried just setting NODE.setSelected(selectAll);, but that didn't work so I tried manually manually filling treeSelection as well.

我觉得这应该很简单，但是一直无法弄清楚，有什么建议吗?

I feel like this should be straightforward, but have been unable to figure it out, any suggestions?

谢谢

推荐答案

PrimeFaces基本上在treeTable中使用术语node来引用每一行，并提供了javascript函数

Basically PrimeFaces uses the term node in the treeTable to refer to each row, and it provides a javascript function PrimeFaces.widget.TreeTable.selectNodesInRange(node) for selecting all the nodes in a rage of another node, and also another function to unselect all the nodes PrimeFaces.widget.TreeTable.unselectAllNodes().

因此，具有以下功能(用于全部选择，无需取消选择就已经存在):

Thus, having the following function (for selecting all, no need to have one for unselecting, it's already present):

function selectAllInTreeTable(widgetVar) {
   widgetVar.tbody.find('tr').each(function() {
      widgetVar.selectNodesInRange($(this));
   });
}

，并假设您的treeTable的widgetVar是treeTableWV，然后将selectAll booleanCheckbox调整为:

and assuming your widgetVar for the treeTable is treeTableWV, and adjusting the selectAll booleanCheckbox into this:

<p:selectBooleanCheckbox widgetVar="selectAllCheckBox" onchange="PF('selectAllCheckBox').isChecked()?PF('treeTableWV').unselectAllNodes():selectAllInTreeTable(PF('treeTableWV'))" >
   ...
</p:selectBooleanCheckbox>

会这样做.

这篇关于如何在PrimeFaces TreeTable中选择全部?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！