Predecessor column inline editing


Hi support,

I have defined predecessor column as follows.

template and editor configured as follows:

But when I’m trying to edit the column, I’m getting below console error.

“ERROR TypeError: t.toLowerCase is not a function
at e.i._getLinkTypeName (link_formatter.ts:75:66)
at e.i.format (link_formatter.ts:16:57)
at s (predecessor.js:42:1)
at r.set_value (predecessor.js:108:1)
at Object.setValue (controller.js:258:1)
at Object.startEdit (controller.js:209:1)
at Object. (default.js:12:1)
at Object.i (eventable.js:23:1)
at Object.t.callEvent (eventable.js:105:1)
at HTMLDivElement.r (mouse.js:41:1)
at ZoneDelegate.invokeTask (zone.js:406:1)
at Object.onInvokeTask (core.js:28659:1)
at ZoneDelegate.invokeTask (zone.js:405:1)
at Zone.runTask (zone.js:178:1)
at ZoneTask.invokeTask [as invoke] (zone.js:487:1)
at invokeTask (zone.js:1600:1)”

Could you please help me with this.

Thank you.


Hello Madhuka,
According to the error message, it occurs in the set_value function of the custom inline editor. But there is no configuration of the inline editor. So, it is hard to suggest what can be wrong.

Please add your configuration to the following snippet and make sure that the issue is reproduced there:
Then, click on the Save button and send me the link.
Or send me a ready demo with all the necessary JavaScript and CSS files so that I can reproduce the issue locally.


Hi Ramil,

Thank you for the instructions. Issue occurred because I set the link type as string in our project. After changing it to string, console error disappeared. However, I have created a new sample as per our project data and I’m facing an issue with predecessor editing.


We are using a custom column called sort_order and I need to display predecessors column using sort_order column value.

When I edit the predecessor, I think it displays wbs code.

Could you please help me to display sort_order value in predecessors column in edit mode too.

Thank you.


Hello Madhuka,
There is no built-in way to specify which parameter the predecessor inline editor should use. But you can use a custom formatter for the link object:
Here are examples of how it can be implemented for the row numbers:

In your case, you will need to make some changes in the format and parse functions.
Here is an example:

const linksByIndexFormatter = {
    format: function (link) {
        return gantt.getTask(link.source).sort_order
    parse: function (formattedValue) {
        return {
            id: undefined,
            source: gantt.getTaskBy(task => task.sort_order == formattedValue)[0].id,
            target: null,
            type: gantt.config.links.finish_to_start,
            lag: 0

Here is the updated snippet: