Data can be loaded from different sources. However, Kanban stores data items as json objects:
{
id: 1,
status: "new",
text: "Kanban board documentation",
tags: "kanban,webix",
$index: 0,
...
}
Each data item possesses a unique id property and a set of other properties:
Kanban Board supports all data formats of the Webix library.
There are 2 main ways you can specify data source for Kanban Board:
To define the data set in the object constructor.
To use the url property.
Both ways lead to one and the same result and don't have any specificity.
If you want to specify the data set directly on the page, you can use the data property.
webix.ready(function(){
webix.ui({
view:"kanban", type:"space",
cols:[
{ header:"Backlog",
body:{ view:"kanbanlist", status:"new" }},
...
],
//data collection data: [ { id:1, text:"Task 1", status: "new"}, { id:2, text:"Task 2", status: "new"} ] });
});
To load data from a file, you can use the url property. The url refers to the JSON object that will be loaded into the board after its initialization.
webix.ready(function(){
webix.ui({
view:"kanban",
type:"space",
cols:[
{ header:"Backlog",
body:{ view:"kanbanlist", status:"new" }},
...
],
//url to the file with data collection url: "tasks.php" });
});
There are a lot of ways to save data in Webix. You can find the detailed description in the Data Saving article.
For example, in the case of using DataProcessor you can set the save property:
webix.ready(function(){
webix.ui({
view:"kanban", type:"space",
cols:[
{ header:"Backlog",
body:{ view:"kanbanlist", status:"new" }},
...
],
url: "tasks.php", save: "../tasks_save.php" });
});
More information about Kanban data loading you can find in DataStore docs.
Back to top