arya-blue
luna-amber
luna-blue
luna-green
luna-pink
nova-dark
nova-light
saga-blue
vela-blue
Kanban
A Kanban board component for visualizing workflow and managing tasks with drag-and-drop functionality.
Source

<pe:kanban id="kanban"
                widgetVar="kanbanWidget"
                value="#{kanbanController.columns}"
                draggable="true"
                addItemButton="true"
                style="height:400px">
        <p:ajax event="drop" listener="#{kanbanController.onDrop}" update="growl" />
        <p:ajax event="itemAdd" listener="#{kanbanController.onAddItem}" update="kanban growl" />
    </pe:kanban>
            
Components and more
Use Cases
Documentation pe:kanban
Attributes (move mouse over the names to see data types)
Name Description
addItemButtonEnable add item button on each board.Default is false.
bindingAn EL expression referring to a server side UIComponent instance in a backing bean.Default is generated.
draggableEnable drag-and-drop functionality.Default is true.
extenderJavaScript function to extend the widget configuration.
idUnique identifier of the component in a namingContainer.Default is generated.
renderedBoolean value to specify the rendering of the component, when set to false component will not be rendered.Default is true.
styleInline CSS style of the component.
styleClassStyle class of the component.
valueList of KanbanColumn objects representing the kanban board columns and items.
widgetVarName of the client side widget.Default is generated ('widget_' + componentClientId).
PrimeFaces Extensions Showcase - © 2011-2025,PrimeFaces: 16.0.0-SNAPSHOT,PrimeFaces Extensions: 16.0.0-SNAPSHOT,JSF: Apache MyFaces Core 4.0 - Impl 4.0.3,Server: Apache Tomcat (TomEE)/10.1.52 (10.1.4),Build time: 2026-05-19 19:35