PrimeFaces Extensions Showcase

OrgChart - Filter Node Example

Demonstrates client-side node filtering based on the official OrgChart filter-node behavior via a clean OrgChart widget API.

Programmatic API demo: quick actions can trigger common searches from business workflows.

Source

XHTML page
Managed bean


<h:form id="filterForm">
        <h:panelGroup layout="block" style="margin:0 0 0.75rem 0;">
            <h:outputText value="Programmatic API demo: quick actions can trigger common searches from business workflows." />
        </h:panelGroup>

        <h:panelGroup layout="block" style="margin:0 0 0.75rem 0;">
            <p:commandButton type="button" value="Quick Filter: VP"
                onclick="PF('orgChartFilterWidget').filterNodes('VP', false); return false;" style="margin-right:0.5rem;" />
            <p:commandButton type="button" value="Quick Filter: Developer"
                onclick="PF('orgChartFilterWidget').filterNodes('Developer', false); return false;" style="margin-right:0.5rem;" />
            <p:commandButton type="button" value="Clear Programmatically"
                onclick="PF('orgChartFilterWidget').clearFilter(); return false;" />
        </h:panelGroup>

        <pe:orgchart id="orgChart"
                     widgetVar="orgChartFilterWidget"
                     value="#{filterOrgchartController.orgChartNode}"
                     filterable="true"
                     draggable="true"
                     exportButton="true"
                     pan="true"
                     zoom="true"
                     direction="t2b"
                     style="height:420px">
        </pe:orgchart>
    </h:form>


@Named
@ViewScoped
public class FilterOrgchartController implements Serializable {

    private static final long serialVersionUID = 1L;

    private OrgChartNode orgChartNode;

    public FilterOrgchartController() {
        init();
    }

    public void init() {
        orgChartNode = new DefaultOrgChartNode("ceo", "CEO", "Alice Johnson");

        final OrgChartNode vp1 = new DefaultOrgChartNode("vp1", "VP Sales", "Bob Martin");
        final OrgChartNode vp2 = new DefaultOrgChartNode("vp2", "VP Engineering", "Carol White");

        orgChartNode.addChild(vp1);
        orgChartNode.addChild(vp2);

        vp1.addChild(new DefaultOrgChartNode("m1", "Sales Manager", "David Green"));
        vp1.addChild(new DefaultOrgChartNode("m2", "Account Manager", "Eve Black"));

        final OrgChartNode engLead = new DefaultOrgChartNode("lead1", "Engineering Lead", "Frank Moore");
        vp2.addChild(engLead);
        engLead.addChild(new DefaultOrgChartNode("dev1", "Developer", "Grace Kim"));
        engLead.addChild(new DefaultOrgChartNode("dev2", "Developer", "Henry Lee"));
    }

    public OrgChartNode getOrgChartNode() {
        return orgChartNode;
    }

    public void setOrgChartNode(final OrgChartNode orgChartNode) {
        this.orgChartNode = orgChartNode;
    }

}