Child row with button (which shows hidden content)

culter

Hello, I have DataTable with button in row child. I have hidden content below the button and I need to display this hidden content after click on this button. I tried it on my own, but the best working version was, that the button in one row child also manages the content of all other childrows.

He re is my test case https://jsfiddle.net/nnb97rh9/1604/

Thank you

colin

Hi @culter ,

Take a look at gyrocode's solution in this thread - that has a child row button in his fiddle.

Cheers,

Colin

culter

Hi colin. Yes, I know about this fiddle. I modified it to do it almost what I need, but there is the problem.

When I open 1 child row and click on the button, everything is working fine, but when 2 child rows are opened, button in 2nd child row interacts with the content in 1st child row. Is it possible to fix it? Thank you

kthorngren

Can you post your example so we can take a look?

My guess is you are using a table ID for the child table? if so they need to be different for each table.

Kevin

culter

Sorry, we had christmas party yesterday

Here it is:

https://jsfiddle.net/192mruyd/1/

colin

Hi @culter ,

Yep, as Kevin said, you've giving all buttons the ID 'MyDIV' - they should be unique. Probably the easiest way is to either give it a timestamp or the row number.

Cheers,

Colin

culter

Thanks, really good point. I'm trying to use "extension number" and I modified this line of format function:

'<div id="' + d.extn + '" style="display:none">Toggle content</div>' +

but I don't know how to get the d.extn to the function at the bottom. I know it has almost nothing to do with dataTables, but maybe it'll help other users too. Thanks

Here is the modified version:
https://jsfiddle.net/192mruyd/2/

kthorngren

Figured the easiest way would be to add a data attribute to the button that contains d.extn. Then used jQuery to get the value of the data attribute which is used in the getElementById.
https://jsfiddle.net/xtsp5db7/1/

Kevin

culter

Thank you, Kevin. It's working great.