Hello,
In my grid, I manage amounts with 2 decimals. I don't want to display the decimals only in edit mode. However, I would like to display the amounts with decimals in a tooltip.
How can I do this?
My column like this,
with formatOptions :
Thanks,
Philippe DUFEIL
Hello Philippe,
Thank you for posting into our community!
I have been looking into your question and what I understand is that the grid’s data source looks similar to the following:
public data: any[] = [ { ProductID: 1, ProductName: 'Apple', UnitPrice: 18.00, }, { ProductID: 2, ProductName: 'Orange', UnitPrice: 25.00, }, ... ];
and after the grid is rendered, the UnitPrice column values should not be displayed as decimal values, however, when hovering over the values, they should be displayed as decimals:
Could you please confirm if my impression is correct?
Additionally, if it is correct, an approach I could suggest is using the igxCell directive in order to template the cell and its tooltip value as desired.
This could look similar to the following:
<igx-column field="UnitPrice" header="UnitPrice" [dataType]="'currency'" > <ng-template igxCell let-value> <div [title]="value | currency : options.currencyCode : options.display : '1.2-2'"> {{ value | currency : options.currencyCode : options.display : options.digitsInfo }} </div> </ng-template> </igx-column>
Furthermore, a similar result could be achieved by using the IgxTooltip component:
<igx-column field="UnitPrice" header="UnitPrice" [dataType]="'currency'" > <ng-template igxCell let-value> <div igxTooltipTarget [tooltip]="value | currency : options.currencyCode : options.display : '1.2-2'"> {{ value | currency : options.currencyCode : options.display : options.digitsInfo }} </div> </ng-template> </igx-column>
Here could be found a small sample demonstrating my suggestion. Please test it on your side and let me know if you need any further assistance regarding this matter.
Additionally, if this is not an accurate demonstration of what you are trying to achieve, please feel free to modify it and send it back along with steps to reproduce it.
Looking forward to your reply.
Sincerely, Riva Ivanova Associate Software Developer
Hello Riva,Thank you for your prompt reply.You have completely understood my problem and your solution is exactly what I expected.
Thank you very much.
Best regards.
Philippe