oData binding to table generates repeated lines in table output

Question

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-

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.
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.

Why don't you use ODataModel2? Why don't you use odata list binding? This helps to get rid redundant intermediate JSON model. In addition, I believe that instead of "read" method call, you can bind the table directly to EntitySet with filters. — Andrii Naumovych
Hi Andrii,Thanks for your response. I am not much aware of v2 model, but I tried just by updating that line of code to refer to V2 model; but that did not work. If you can help with a working example of v2 model maybe I can then better and implement it correctly. Also, you said we we can bind the table directly to EntitySet; is it in case of v1 model itself? or is it the benefit of using v2? — Chandan Jha
Also, just to clarify better I haven't assigned any model binding to the table initially. Only after an action, in my case a dropdown change will update the table data using this call made through controller. Yet, initially the table gets 3 blank lines. — Chandan Jha

Andrii Naumovych Andrii Naumovych · Accepted Answer · 2018-01-10T08:44:30

You can bind your table directly to the ODataModel:

Steps:

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.
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.
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.

oData binding to table generates repeated lines in table output

1 Answers