Responsive details programmatically
Responsive details programmatically
![gSibinger](https://secure.gravatar.com/avatar/6c9e912727c28b96090feece675f7268/?default=https%3A%2F%2Fvanillicon.com%2F6c9e912727c28b96090feece675f7268_200.png&rating=g&size=120)
in Responsive
I need to toggle the child rows containing responsive details from a specific button. When using the row API, the function row().child() returns undefined, though. There are several column inside the responsive details area, using the "none" class. How can I access these through the datatables API?
This discussion has been closed.
Answers
See if Allan's answer in this thread helps. The
row().child()
APIs are for manually creating Child Rows like in this example.Kevin
Hi Kevin,
unfortunately this is not helping in my case. This approach apparently still uses the inline-trigger for responsive details, which I can't use. The reason I need to toggle the details from another button is, that I use click events inside the first cell of a row for a different function.
Regards
Georg
Can you create a test case demonstrating what you want, please, as that would help understand the problem here. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.
Cheers,
Colin
Hi Colin,
I am now using a dedicated, always visible column to handle responsive details. This basically resolves the issue.
I am still curious though, how datatables internally handles the visibility of these details and if you can access these internal functions via the row API.
Regards
Georg
So did I. This is my custom button for that task.
If most of the child rows are visible the button will hide all child rows. If most of the child rows are hidden the button will show all child rows.
It also uses a spinner because this isn't always very fast ...
showHideAllChildRowsSelectedLabel is a global variable containing the language dependent label of the button ('Toggle Child Rows' or 'Details ein-/ausblenden').
in addition I have this code here to make sure the toggle button is only shown when child rows exist at all, i.e. if the responsive extension has hidden some columns:
You will need the very latest DT and Editor versions for this to work. There had been a bug in responsive.hasHidden() in previous versions.