topic Re: Getting a tooltip on a table row in an app in Developer Q&A Forum

Getting a tooltip on a table row in an app

SjoerdB — Mon, 11 Aug 2025 07:47:54 GMT

Hi,

I would like to get a tooltip on a table row in my app, however the tooltip is only meant for buttons and inputs, not for table elements.

If I look at e.g. the delivered "Logs" app, I see a button is used for the complete row. What construct is used here, how could I mimic this in my app?

Re: Getting a tooltip on a table row in an app

dani_coll — Mon, 11 Aug 2025 10:33:25 GMT

Hi SjoerdB!

Which version of the logs app do you have? I'm taking a look at the app v1.14.0 and there is no button on my table

Re: Getting a tooltip on a table row in an app

SjoerdB — Mon, 11 Aug 2025 11:41:46 GMT

for me, it's the 1.13.0...

But... do you get a tooltip on the (long) values, showing you the complete record...

because if so, then maybe this version either is using an input as field, or moved the button down to cell level to do a tooltip per individual cell..

Re: Getting a tooltip on a table row in an app

dani_coll — Thu, 28 Aug 2025 08:01:33 GMT

Hi SjoerdB, apologies for the delay.

Looks like version 1.14.0 of Logs app onwards is using a newer version of Strato where the DataTableV2 does not have the button element as a child of the row anymore, now they are controlling the interactivity of the row within the row element.

Unfortunately, there is no way to have a tooltip on the row level. Only on the cell level do we allow custom-rendered cells, configured by column definition:

const columnsWithCustomCell: DataTableV2ColumnDef<(typeof data)[number]>[] = [ { header: 'FirstName', id: 'firstname', accessor: 'firstname', width: 'auto', }, { header: 'LastName', id: 'lastname', accessor: 'lastname', width: 'auto', cell: ({ value, rowId }) => {. =========================== HERE ============================= return ( <DataTableV2.DefaultCell> <TerminologyOverlay> <TerminologyOverlay.Trigger>{value}</TerminologyOverlay.Trigger> <TerminologyOverlay.Description> <div onClick={() => console.log(`clicked description of cell in row "${rowId}"`) } > {`This is a description of cell in row "${rowId}".`} </div> </TerminologyOverlay.Description> </TerminologyOverlay> </DataTableV2.DefaultCell> ); }, }, ];

Re: Getting a tooltip on a table row in an app

SjoerdB — Fri, 12 Sep 2025 09:10:22 GMT

Thanks @dani_coll , sorry I respond so late, I missed your answer because of holidays.

Re: Getting a tooltip on a table row in an app

raymond_shanley — Fri, 19 Dec 2025 14:04:15 GMT

Depending on what you want to achieve, alternatively, you could use the row details / expandable rows feature:

https://developer.dynatrace.com/design/components-preview/tables/DataTable/#enable-expandable-rows

Re: Getting a tooltip on a table row in an app

SjoerdB — Mon, 22 Dec 2025 10:27:00 GMT

Hi @raymond_shanley , that is actually what I did in the end, make sure for long fields to use `textOverflow: "ellipsis"`, and add my complete story that I wanted to show in an expandable row.

Thanks for following up!