ColumnModel

Represents a single column on a TaskBoard.

When creating a TaskBoard, you can either supply an initial set of columns or have the columns be loaded remotely as part of the Project data. These columns are either defined as plain strings, ColumnModel data objects or ColumnModel records (or a mix thereof). When using strings, the string will be used as is as the column's id and capitalized as its text.

const doneColumn = new ColumnModel({
    id   : 'done',
    text : 'Done'
});

const taskBoard = new TaskBoard({
    columns : [
        // String, equal to passing { id : 'todo', text : 'Todo' }
        'todo',
        // Data object, in this case with a fixed width and not collapsible from the UI
        { id : 'doing', text : 'Doing', width : 200, collapsible : false }
        // Record, not commonly used since it is easier to supply the data object directly
        doneColumn
    ]
});

Loading Columns remotely

const taskBoard = new TaskBoard({
    // Project will load columns, tasks, resources and assignments
    project : {
        loadUrl  : 'data/data.json',
        autoLoad : true
    }
});

data.json

{
  "success" : true,
  "columns" : {
    "rows" : [
      {
        "id"   : "todo",
        "text" : "Todo"
      },
      {
        "id"          : "doing",
        "text"        : "Doing",
        "tasksPerRow" : 2
      },
      {
        "id"          : "review",
        "text"        : "Review",
        "tasksPerRow" : 2
      },
      {
        "id"          : "done",
        "text"        : "Done",
        "tasksPerRow" : 2
      }
    ]
  }
}

You can see this in action in the columns-remote demo in the examples folder.