Nested rows - Collapse all rows per default?

Tags: #<Tag:0x00007f4523f5cdb8>

Hi,
How can I collapse all rows per default using Nested Rows plugin?

When I search this issue, I can see some answers that refers to doing the following:
It refers to the collapseUI property on the NestedRows plugin, and then using it to collapse a row:
let collapseUI = this.Handsontable.getPlugin(‘nestedRows’).collapseUI

However, this doesn’t work with latest Handsontable, Typescript throws a compilation error. The property is not available via the public api. I can see that it is an internal property.
Is there any way of collapsing all the rows with the latest Handsontable version?

Thanks!
Best wishes, Anders

Also, is there any onclick event that I can tap into, as I want to keep track of the state of the expanded/collapsed row - i.e. I want to easily determine whether the row is expanded or collapsed.

Hi @anders.branderud

To collapse all the rows you can use collapseAll() method. However, it is not working correctly at the moment. The issue on that was reported here, https://github.com/handsontable/handsontable/issues/8900 on our Github board. This issue is already solved and will be fixed in the next release (planned for the middle of January).

When it comes to a hook it is not yet provided. What I was doing to determine the state of nested row was on checking the nodes themselves via mouseup event like here https://jsfiddle.net/3df9zap4/

If that won’t be enough let me know and will check it together.

Hi Aleksandra,

Thanks for your response!
I asked about the nestedRows plugin, your example is related to the collapsibleColumns plugin. I want the rows to collapse, not the columns.

The collapsibleColumn plugin has a collapseAll method exposed on the api, see https://handsontable.com/docs/api/collapsible-columns/

However the nestedRows plugin doesn’t have any collapse method on the api strangely, although it is equally important to be able to collapse all rows, see https://handsontable.com/docs/api/nested-rows/

Thank you for the mouseup event solution. I implemented my own solution after writing the question.

Best wishes, Anders

Ah yes! Thank you for that note.
For nestedRows here http://jsfiddle.net/handsoncode/gceqrLd2/ is an example of collapsing a section (one parent) and you can run it for all of the parents if you do not want to wait for the collapseAll() to be unlocked by this fix https://github.com/handsontable/handsontable/issues/8900

Thank you,
The solution you just quoted is the one I mentioned in my initial post, the one that doesn’t work for me. Apparently it works in Javascript, but what can I do in Typescript (please refer to my first post)?

collapsingUI is am internal UI, that is not listed in the definition file for Handontable. Here https://github.com/handsontable/handsontable/issues/6455 is a corresponding topic. After an internal API becomes an official one we add them typing.

Hi @anders.branderud

We just fixed the issue described at https://github.com/handsontable/handsontable/issues/9006 in Handsontable v 11.1.0
Please update and let me know if it works for you.

Than you Aleksandra,
My main problem was that I didn’t get it to work with Typescript.
I got it working now with this code:
CollapseAllDetailedRows() {
let nestedRowsPlugin: any;
nestedRowsPlugin = ReferenceWeeksTable.Handsontable.getPlugin(‘nestedRows’);
nestedRowsPlugin.collapsingUI.collapseAll();
}

Thank you!

great to hear. Thank you for the update.