an object that contains definitions of inline editors

object editor_types;


gantt.config.editor_types.custom_editor = {// custom editor logic}


The config can be used for creation of custom editors (see the above example).

There are several predefined inline editors:

  • text - (InlineEditor) - for editing text columns, e.g. task name
  • number - (InlineEditor) - for editing number columns, e.g. task duration, order, etc.
  • date - (InlineEditor) - for editing date columns, e.g. start and end dates of the task
  • select - (InlineEditor) - for choosing an option from a list
  • predecessor - (InlineEditor) - for setting task-predecessor for the currently edited task. This editor gets the WBS codes of tasks to set connection with the predecessor task.
  • [customEditorName: string] - (InlineEditor | undefined) - custom inline editors

Editors defined in this object can be attached to gantt columns:

const textEditor = {type: "text", map_to: "text"};
const dateEditor =  {type: "date", map_to: "start_date",
    min: new Date(2018, 0, 1), max: new Date(2019, 0, 1)};
gantt.config.columns = [
    {name: "text", label: "Task name", tree: true, width: "*", editor: textEditor},
    {name: "start_date", label: "Start time", align: "center", editor: dateEditor}
See also
Back to top