columns
Description
Optional. An array of objects containing the columns data
Usage
columns?: [
{
id: string,
label?: string,
collapsed?: boolean,
limit?: number | object,
strictLimit?: boolean
},
{...} // other columns data
];
Parameters
For each column you can specify the following parameters (data):
id
- (required) a column ID. It is used for managing the column via the corresponding methodslabel
- (optional) a column label. It is displayed in the column sectioncollapsed
- (optional) a current state of the column. If true, the column is collapsed initially. Default value is false (expanded state)limit
- (optional) this parameter may take one of the two types of values:number
- a limit of cards in the current columnobject
- an object with the limits of cards for each row (swimlane) by its ID
strictLimit
- (optional) a strict limit mode. If true, a user will not be able to create new cards over the specified number via the limit parameter. Default value is false
info
If you want to load new data for columns dynamically, you can use the parse() method!
Example
const columns = [
{
label: "Backlog",
id: "backlog",
collapsed: true,
limit: 3,
strictLimit: true
},
{
label: "In progress",
id: "inprogress",
collapsed: false,
limit: {
// limit the number of cards for the "Feature" and "Task" rows of the "In progress" column
feature: 3,
task: 2
},
strictLimit: false
},
{ label: "Done", id: "done" }
];
new kanban.Kanban("#root", {
columns,
cards,
rows,
// other parameters
});
Change log:
- Starting from v1.1 the columns property is optional
- The collapsed parameter was added in v1.1
- The limit parameter was added in v1.1
- The strictLimit parameter was added in v1.1
Related sample: Kanban. Limits for columns and swimlanes