Provide a way to lazy load tree node sub-items.

Hi thanks for premium quality free library. I am in demand of new feature for tree structure.There is some scenario in which i need to load children of a node lazily on demand, but i couldn’t find formal way of doing that and i made it working using a trick. my trick right now is using dataTreeRowExpanded event and make an ajax request for sub-items and populating row’s model children property with new data and calling updateData on table instance but definitely this is not best practice.At least providing another event handler like dataTreeBeforeRowExpand will avoid extra call to updateData. thanks for you’r concern

[olifolkerd]

Im afraid there is no way to achieve this with a good user experience.

The table is simply not setup to load data asynchronously into child rows, and even if it were it would be a terrible user experience for users to click an element and nothing happen for a while untill the data loaded.

For that reason i have no intention of adding this as a feature to Tabulator.

That being said, if you wanted to implement something yourself it should be achievable.

I would recommend that you populate your rows with a dummy “loading” row that displays an ajax spinner when it is opened, that way the user is then aware that they are waiting for data.

you could then use the dataTreeRowExpanded callback to request the data, and then call the update function on the row component to pass the new children into the row.

I Hope that helps,

Cheers

Oli 😃

[drivera-armedia]

I seem to have spoken too soon… the row.update() invocation causes the expansion to fail. If I remove that, the row is expanded correctly with the placeholder data from the base template.

I also tried row.getTable().updateRow(row.getIndex(), newData)

I also tried adding a row.reformat() invocation to the update promise…no dice…

The reason this is necessary is because we know that the initial “summary” will return a LOT of rows, but it’s very very quick, so we can display the full table. However, if we try to pull the details for each row, then things get VERY slow because the detail fetches are expensive when done in bulk.

Thus, it’s cheaper to just pull the details on demand as the user needs them (i.e. they expand each row). We don’t do pagination because we chose to keep the server-side API simple.

So…thoughts?