Premium support for our pure JavaScript UI components


Post by MauriceLapre »

Hi!

I used to manipulate the tasktooltip on Gantt 6.0.6 with this:

taskTooltip : {
            template(data) {
                const
                    me             = this,
                    { taskRecord } = data;                    

[...]

                return TaskTooltip.defaultConfig.template.call(me, data) +                    
                `<table border="0" cellspacing="0" cellpadding="0">
                    <tr><td style="padding-right:5px;">${me.L('Equipment')}:</td><td>${taskRecord.equipment ? taskRecord.equipment : ''}</td></tr>
                    <tr><td style="padding-right:5px;">${me.L('Status')}:</td><td>${taskRecord.status ? woStatus : ''}</td></tr>
                    <tr><td style="padding-right:5px;">${me.L('WO Type')}:</td><td>${taskRecord.wotype ? woType : ''}</td></tr>
                    <tr><td style="padding-right:5px;">${me.L('Priority')}:</td><td>${taskRecord.priority ? woPrio : ''}</td></tr>
                </table>`;

But that's not working anymore, I'm getting "TypeError: Cannot read properties of undefined (reading 'call')" on TaskTooltip. Is there no defaultConfig anymore?

Kind regards,
Maurice


Post by tasnim »

Hi,

Yes, there is no defaultConfig anymore. Now you should use this instead

TaskTooltip.configurable.template.call(me, data)

And it should work as expected for you :) !

Best regards,
Tasnim

How to ask for help? Please read our Support Policy


Post by MauriceLapre »

Thanks! It's working like a charm again!

Do you perhaps know how I can align the default table rows so it aligns neatly with the added custom rows?

Schermafbeelding 2025-08-28 085909.png
Schermafbeelding 2025-08-28 085909.png (26.54 KiB) Viewed 4197 times

Post by tasnim »

You can inspect the tooltip and play with the styles in the browser devtools.

Maybe you can set justify-content: flex-start

Hope this gives you an idea :)

Best regards,
Tasnim

How to ask for help? Please read our Support Policy


Post by Animal »

Try

.b-gantt-task-tooltip table {
    width: 100%;
}

Post by MauriceLapre »

Animal wrote: Thu Aug 28, 2025 3:17 pm

Try

.b-gantt-task-tooltip table {
    width: 100%;
}

Yes, that's working perfectly. Thank you!


Post Reply