SAPUI5 TreeTable's getRows method returns empty array on the first call

Question

I am trying to build an SAPUI5 application using TreeTable and I'm facing some problems to use its methods.

In my app, I have a button which triggers this method.

onChangeViewContext: function(oEvent) {
        .........
        .........
        var aViewContext = oContext.oModel.getProperty(sPath + "/ViewContext");
        var aDataModel = oContext.oModel.getProperty("/ApplicationCollection/" + sAppId + "/DataModel");
        var oStructure = this._createParentChildStructure(aDataModel);
        var oTreeModel = this.getView().getModel("treeModel");
        oTreeModel.setData(oStructure);
        this._oViewDetailLine = oSource.getParent().getParent().getParent();
        this._oViewDetailLine.setVisible(false);
        this.byId("idSelectElementsPanel").setVisible(true);
        this._setSelectedItems(aViewContext, oTree);
    }

What I'm trying to do here is only bind the rows with my treeModel, get tree table object and send it to my _setSelectedItems method which below.

_setSelectedItems: function(aViewContext, oTree) {
        oTree.clearSelection();
        var sElementName;
        var aSelectedIndices = [];
        var aElements = [];
        var aRows = oTree.getRows();
        aRows.forEach(function(row) {
            if (row._oNodeState !== undefined) {
                aElements.push(row.getCells()[0].getText());
            }
        });

I need to get rows array here because I will use it for setting selected items of tree table. The problem is when "onChangeViewContext" triggered, oTable.getRows() returns an empty array. But when I click cancel button (which just hides my tree table, nothing more) and then trigger "onChangeViewContext" function again, I can get the rows array completely.

Even on the first call when I try to get table's model, I can get the treeModel and its data correctly.

I've tried to refresh bindings, aggregations etc. But no luck.

By the way, I'm using row binding in my xml view like this :

<t:TreeTable id="idSelectElementsTree" rows="{path: 'treeModel>/'}" selectionMode="MultiToggle" enableSelectAll="false"
            rowSelectionChange="onSelectElement">

I'm really drowning here so any any help would be appreciated.

Edit : rest of the setSelectedIndexes function :

aViewContext.forEach(function(name) {
            sElementName = name;
            if (aElements.indexOf(sElementName) !== -1) {
                aSelectedIndices.push(aElements.indexOf(sElementName));
            }
        });
        aSelectedIndices.forEach(function(idx) {
            if (oTree.getRows()[idx]._bHasChildren) {
                oTree.expand(idx);
            }
            oTree.addSelectionInterval(idx, idx);
        });

Answer 1

What could help here is to add an event rowsUpdated="onRowsUpdated" to the table in the XML view. This event is triggered after the table has been loaded and will hence provide you with the data via;

this.getView().byId("sTableId").getRows();

The difference to your approach is that the event would not be triggered by the press of a button but automatically, as the table is rendered. You can then also use this function to trigger another one as per your use case.