oData binding to table generates repeated lines in table output

I have an OData connection using which I read an entityset with conditions that returns me data in the following structure. The data being in the root node itself rather than in an object array-

oData Structure

I am then setting this data to a JSON Model and binding this model to my oTable. The code in controller looks something like below-

//Get data for the table
var oTabData = sap.ui.getCore().byId("MyTable");
var sServiceUrl = "http://example.com/sap/opu/odata/SAP/ZXX_SRV";
var oModel2 = new sap.ui.model.odata.ODataModel(sServiceUrl,true);
var oJsonModel = new sap.ui.model.json.JSONModel();
oModel2.read("/MyEntitySet(Myvar1='000001',Myvar2='abc')?
$format=json",null,null,true,function(oData,response){  
        oJsonModel.setData(oData);
    });
oTabData.setModel(oJsonModel);

The view contains the table and the binding is as below. Have ignored rest of table declaration code to keep it short. Table declared as oTable with id MyTable and with all the right columns-

//Template to map the data to the respective column
var template = new sap.m.ColumnListItem({
    id:"table_template",
    type: "Navigation",
    visible: true,
    cells:[
        new sap.m.Label({
            text: "{/Myvar1}"
        }),
        new sap.m.Label({
            text: "{/Myvar2}"
        }),
        new sap.m.Label({
            text: "{/Myvar3}"
        }),
        new sap.m.Label({
            text: "{/Myvar4}"
        })
    ]
});

var oFilters = null;
oTable.bindItems("/",template,null,oFilters);

The issues are-

  1. As I have made a service call with conditions the oData output received does not output an array of data like it does when we make a call without conditions (oModel2.read("/MyEntitySet?$format=json",null,null,true,function(oData,response)). In the latter case the output comes under results array for which the binding assignment is /results and that works right as expected.
  2. In current case (service call with conditions), as the columns in output are available right in the root level, have used binding / and in template as well using / in front of every element (e.g. {/Myvar1} as seen above). But using this technique it also creates 3 default blank lines in table initially. When the above controller code is executed, it fills the table 3 x 4 times i.e. 12 rows for a single row output.

Due to organization restrictions I cannot put the original code here. But this is how the scenario is. Any help would be appreciated.

Thanks.

PS: Haven't used any loop that would generate the repeated lines.

1 answer

  • answered 2018-01-10 04:25 Andrii Naumovych

    You can bind your table directly to the ODataModel:

    Steps:

    1. Before doing binding, you need to create a template for the table rows, in sap.m.Table it is ColumnListItem control, I would suggest to carry it out to the XML fragment. Try to use XML for markup as much as possible, becasue it much clearer and maintainablier than js coding; All the controls in "cells" should be bound to the rows' properties using relative paths.
    2. Tell the View about your model by calling "oView.setModel(MODEL_INSTANCE)", by this line you set the default model to the view. From now on all the controls inside are able to see it. The model is default because the name of it was not specified.
    3. oTable.bindItems("/MyEntitySet", { template: oColumnListItem, filters: aFilters}); - this will automatically trigger an OData call to grab all needed data. The table will be updated automatically. You should see the rows.