Search code examples
odatasapui5

sap.m.table does not get updated


I have a tab in a view including a table (declared in the XML view) supposed to be populated with the press of a button. Button attaches some filters and calls the model.read() method which returns results successfully. However the table remains empty.

I know that the XML view binding is correct because before using the button logic populated some data via a hard-coded call in Component.js and data appeared as expected.

I know also that the data are coming back, debugged at the end of the function and all data are there. I tried even refreshing the model with the bForceUpdate parameter set to "true" at the end of the function but no luck either. Code in doubt and the table part of the XML view is below.

Controller function code - only filter manipulation above

if ( sYearFmParam === "" || sYearToParam === "" ) {
    MessageBox.error(
        this.getModel("i18n").getResourceBundle().getText("fiscalYearEmptyErrorMesage"),
        {
            actions: [MessageBox.Action.CLOSE]
        }
    );                  
} else if ( sYearFmKey <= sYearToKey ) {
    if (sYearDiff < 15) {
        this.oReportModel.read(sPath, { filters: oTableSearchState,
            success: function(oData, oResponse) {
                oStsReportDataDeferred.resolve();
            },
            error: function(oError) {
                jQuery.sap.log.error("Error", oError);
            }
        });                     
    } else {
        MessageBox.error(
            this.getModel("i18n").getResourceBundle().getText("fiscalYearDiffErrorMesage"),
            {
                actions: [MessageBox.Action.CLOSE]
            }
        );                      
    }
} else {
    MessageBox.error(
        this.getModel("i18n").getResourceBundle().getText("fiscalYearErrorMesage"),
        {
            actions: [MessageBox.Action.CLOSE]
        }
    );                  
}
var readyToGo = function() {
    this.oReportModel.refresh(true);
    this.getModel("Global").setProperty("/statusTableVisible", true); 
    jQuery.sap.log.debug("report refreshed");
};

jQuery.when(oStsReportDataDeferred).done().then( jQuery.proxy(readyToGo, this) );

XML view - only the table part

<Table id="statusReportTable"
    items="{
        path: 'Report>/Status_Report_DataSet',
        sorter: { path: 'ReportBy' }
    }"                          
    width="auto"
    class="sapUiResponsiveMargin"
    noDataText="{worklistView>/tableNoDataText}"
    busyIndicatorDelay="{worklistView>/tableBusyDelay}"
    growing="true"
    growingScrollToLoad="true"
    visible="{Global>/statusTableVisible}">

    <headerToolbar>
        <Toolbar>
            <Title id="statusReportToolbar" text="{worklistView>/summaryTableTitle}"/>
            <ToolbarSpacer />
        </Toolbar>
    </headerToolbar>
    <columns>
        <Column></Column>
        <Column></Column>
        <Column></Column>
        <Column></Column>
        <Column></Column>
        <Column></Column>
        <Column></Column>
        <Column></Column>
        <Column></Column>
        <Column></Column>
        <Column></Column>
        <Column></Column>
        <Column></Column>
        <Column></Column>
        <Column></Column>
    </columns>


    <items>
        <ColumnListItem>
            <cells>
                <Text text="{Report>ReportBy}" width="100px"/>  
                <Text text="{path: 'Report>StsStarted1'}" width="40px"
                   visible="{path: 'Report>StsStarted1v', formatter: '.formatter.setStatusColumnVisibility'}"/> 
                <Text text="{path: 'Report>Sts0041'}" width="40px"
                   visible="{path: 'Report>Sts0041v', formatter: '.formatter.setStatusColumnVisibility'}"/> 
                <Text text="{path: 'Report>Sts0021'}" width="40px"
                   visible="{path: 'Report>Sts0021v', formatter: '.formatter.setStatusColumnVisibility'}"/> 
                <Text text="{path: 'Report>Sts0031'}" width="40px"
                   visible="{path: 'Report>Sts0031v', formatter: '.formatter.setStatusColumnVisibility'}"/> 
                <Text text="{path: 'Report>StsAct1'}" width="40px"
                   visible="{path: 'Report>StsAct1v', formatter: '.formatter.setStatusColumnVisibility'}"/> 
                <Text text="{path: 'Report>Sts0011'}" width="40px"
                   visible="{path: 'Report>Sts0011v', formatter: '.formatter.setStatusColumnVisibility'}"/>
                <Text text="{path: 'Report>Sts0061'}" width="40px"
                   visible="{path: 'Report>Sts0061v', formatter: '.formatter.setStatusColumnVisibility'}"/>
                <Text text="{path: 'Report>StsStarted2'}" width="40px"
                   visible="{path: 'Report>StsStarted2v', formatter: '.formatter.setStatusColumnVisibility'}"/>
                <Text text="{path: 'Report>Sts0042'}" width="40px"
                   visible="{path: 'Report>Sts0042v', formatter: '.formatter.setStatusColumnVisibility'}"/>
                <Text text="{path: 'Report>Sts0022'}" width="40px"
                   visible="{path: 'Report>Sts0022v', formatter: '.formatter.setStatusColumnVisibility'}"/>
                <Text text="{path: 'Report>Sts0032'}" width="40px"
                   visible="{path: 'Report>Sts0032v', formatter: '.formatter.setStatusColumnVisibility'}"/>
                <Text text="{path: 'Report>StsAct2'}" width="40px"
                   visible="{path: 'Report>StsAct2v', formatter: '.formatter.setStatusColumnVisibility'}"/>
                <Text text="{path: 'Report>Sts0012'}" width="40px"
                   visible="{path: 'Report>Sts0012v', formatter: '.formatter.setStatusColumnVisibility'}"/>
                <Text text="{path: 'Report>Sts0062'}" width="40px"
                   visible="{path: 'Report>Sts0062v', formatter: '.formatter.setStatusColumnVisibility'}"/>
            </cells>
        </ColumnListItem>
    </items>
</Table>

Solution

  • I can't really say why your table does not display anything, but I can notice that you are not using the OData model completely correctly regarding the filtering. Looking at the table items' binding from the XML view, I would expect that the table displays all the entities from the Status_Report_DataSet entity set. If it is not the case then either the backend OData service returns no entities at all if you attempt to read the whole entity set or the binding is suspended in your controller manually.

    The OData model (and the whole model concept in UI5 in general) requires you to add the filters to the binding of the table. Doing programmatic read calls does not affect the table contents. The correct way of doing it would be:

    this.byId("statusReportTable").getBinding("items").filter(oTableSearchState);
    

    Also, doing a model refresh will simply re-trigger one or more read requests for all the bound entity sets or individual entities.