Problem with a customized tooltip when move the task

[Adolfo Oestereich]

Hello, 

I'm having a trouble with the customized tooltip when move a tasks on gantt, when moving then the a div with the tolltip content is created below the gantt itself.

Attachment: tooltip_eb1002fe.rar

[Gopinath Muniraj]

Hi Adolfo, 

Thanks for contacting Syncfusion support. We have analyzed your query. We are also able to reproduce the issue. We considered this as bug from our side. We have logged a bug report for this. The status can be tracked through below feedback link. 

Feedback link: https://www.syncfusion.com/feedback/20716/issue-in-taskbar-editing-tooltip-template  

We will include this fix in our upcoming patch release, which is scheduled on December 30, 2020. 

Thanks for your patience until then. 

Thanks, 

Gopinath M 

[Gopinath Muniraj]

Hi Adolfo, 

Thanks for your patience. 

We glad to announce that the issue mentioned in the feedback was fixed. Please update your Gantt packages to the latest version. We have prepared a sample for your reference. Please get the sample from below link. 

Sample: https://stackblitz.com/edit/editing-tooltip-kiqrf4?file=package.json  

Please contact us if you have any concerns. 

Regards, 

Gopinath M 

[Adolfo Oestereich]

Hello, still getting the error. I just updated the gantt component and change the template like the one in the example.

I am using *ngif, to show or not some of the informations. Do you think this can cause an error ?

[Gopinath Muniraj]

Hi Adolfo, 

We have analyzed your query. 

We can check the conditions in the tooltip rendering using *ngIf in the ng-container. Please refer the below code snippet, 

        [app.component.html] 

       <ng-template #tooltipSettingsTaskbar let-data> 

            <div> 

              <table> 

                        <ng-container *ngIf="data.showProgressTooltip"> 

                          <tr> 

                                      <td style="padding:3px">Progress:</td> 

                                      <td style="padding:3px">{{(data.Progress)}}</td> 

                          </tr> 

                        </ng-container>  

                        <ng-container *ngIf="data.showStartDateTooltip"> 

                                                <tr> 

                                                            <td style="padding:3px">Starts On:</td> 

                                                            <td style="padding:3px">{{format(data.StartDate)}}</td> 

                                                </tr> 

                        </ng-container> 

                        <ng-container *ngIf="data.showEndDateTooltip"> 

                                                <tr> 

                                                            <td style="padding:3px">Ends On:</td> 

                                                            <td style="padding:3px">{{format(data.EndDate)}}</td> 

                                                </tr> 

                                    </ng-container> 

              </table>    

              </div> 

       </ng-template> 

 

To do this we need to define these fields in the datasource. In this template, we can modify the data content in tooltip. But we cannot show or hide using template option. If we want to change the tooltip content as per our requirement, we can handle it through the beforeTooltipRender (client-side event). 

 

We have prepared a sample for your reference. Please get the sample from below link. 

Sample: https://stackblitz.com/edit/angular-emlihh?file=app.component.ts  

Please let us know if you need any further details on this. 

Regards, 

Gopinath M 

[Adolfo Oestereich]

It was my first try use in ngContainer but without sucess. So after i tried with "TR"  still getting the error on both.

The same happens in one of your examples.

I noticed that the error ir more likely to happen when i try to move te taskbar up and down. 

[Gopinath Muniraj]

Hi Adolfo, 

We have analyzed your query. We can reproduce the reported issue. 

We consider this as bug from our side, and we have logged a bug report for this - Error in editing tooltip while using ngIf container. The status can be tracked through below feedback link. 

Feedback link: https://www.syncfusion.com/feedback/21819/error-in-editing-tooltip-while-using-ngif-container  

The fix for this issue will be included in our upcoming patch release which is expected to be rolled out on 10^th February 2021. 

We will appreciate your patience until then. 

Regards, 

Gopinath M