TreeTable - Dynamic Columns

Columns of TreeTable can be created dynamically using the p:columns component.

Documentation
Document Viewer
NAMESIZETYPE
<style type="text/css">
    .ui-treetable table {
        table-layout: fixed
    }
</style>


<h:form id="form">
    <h:panelGrid columns="3" style="margin:10px 0">
        <p:outputLabel for="template" value="Template:" style="font-weight:bold"/>
        <p:inputText id="template" value="#{ttColumnsView.columnTemplate}" size="50"/>
        <p:commandButton update="tt" action="#{ttColumnsView.createDynamicColumns}" value="Update" process="@parent" icon="pi pi-refresh" />
    </h:panelGrid>
    
    <p:treeTable id="tt" value="#{ttColumnsView.root}" var="document">
        <f:facet name="header">
            Document Viewer
        </f:facet>
        <p:columns value="#{ttColumnsView.columns}" var="column" headerText="#{column.header}">
            <h:outputText value="#{document[column.property]}" />
        </p:columns>
    </p:treeTable>
</h:form>

FREE THEMES

Built-in component themes created by the PrimeFaces Theme Designer.

nova-light Nova-Light
nova-dark Nova-Dark
nova-colored Nova-Colored
luna-blue Luna-Blue
luna-amber Luna-Amber
luna-green Luna-Green
luna-pink Luna-Pink
omega Omega

PREMIUM TEMPLATES

Create awesome applications in no time using the premium templates and impress your users.