This sample demonstrates the basic Kanban board functionality, including data binding, column mapping, card rendering, and drag-and-drop interactions. Cards are organized into workflow stages and can be moved across columns to reflect status changes.
The Kanban board is populated using a predefined data source and displays tasks across multiple workflow stages. Tasks are grouped into columns based on the field configured through the keyField property. In this example, the board is configured using the following core Kanban properties: dataSource - Binds the task collection to the Kanban board. columns - Defines the workflow stages displayed on the board. keyField - Maps task status values to their corresponding columns. cardSettings - Configures the information displayed within each card. Cards can be dragged and dropped between columns to update workflow status. The board also supports visual customization through card templates, tags, priorities, and resource indicators. More information on the Essential® JS2 Kanban board can be found in this documentation section. Looking for the full JavaScript Kanban component overview, features, pricing and documentation? Visit the JavaScript Kanban page.