Skip to Content
avatar image
Former Member

Question on Comparision Chart & Binding

Hello everybody,

i'm trying to implement the sapui5 control comparision chart & i'm a little stuck at the moment. It's not like its not working at all, but i've a problem understanding it.

The following i've done:

1) NetWeaver Gateway Service Implementation:
     Comparision / ComparisionSet with the following attributes: title, value, color

     Service is working fine & returns 2 Entries.

2) Create UI5 App with XML Views & Controller => Everything works fine & Data is displayed as required.

The following code is in my XML View Definition:

3) Current Result:

The approach in the printscreen works. ComparisionData Elements are displayed and binding works. But if the oData Service returns 3 or more Element, they are not displayed, because title attribute is binded with {/data/results/<Index>/title.

How can i eliminate the <Index> in the binding of the attribute?

I've done it already with the control table but i cant figure out how it should be done with ComparisionChart Control.

Comparision Chart has compared to table no attribute items and because of that, i'm not 100% sure how the aggegation binding (right?) is done.

The following i've tried already:

added attribute path to <com:data path="/data/results"> => This gives no error in console

added attribute path to <com:ComparisionChart path="/data/results"...> => This gives an Assertion Error in Console (unknown attribute path)

What i need:

1) If someone could send me a link or example with the comparision chart above without index in binding that would help.

2) Ressources where i can read about the topic to get the knowlodge how binding is working (a bit further then sapui5 developer guide samples).

3) Helpful comments on what i would have to change in the XML View & perhaps in the controller.js of that view to get rid of the index in the attribute binding.

Thanks a lot i advance.

Kind regards,


data.png (45.3 kB)
binding.png (12.4 kB)
result.png (1.9 kB)
Add comment
10|10000 characters needed characters exceeded

  • Get RSS Feed

2 Answers

  • Best Answer
    avatar image
    Former Member
    Aug 31, 2015 at 11:20 AM

    Hello everybody,

    i found the solution now. I had a issue in my understanding of sapui5.

    Following link provided the missing know-how part for my issue:

    Aggregation Binding - User Interface Add-On for SAP NetWeaver - SAP Library

    The following i added in the controller.js of my view:

    oCompItem is a function, that returns a new object of ComparisionData.

    oCompItem : function() {

      return new sap.suite.ui.commons.ComparisonData({title:"{title}", value:"{value}", color:"{color}"});


    In the onInit Method i did the aggregation binding on my control.

    var compcontrol = this.oView.byId("cc01"); //get control by Id

    compcontrol.bindAggregation("data", "/data/results", this.oCompItem); //add Aggregation Binding for aggregation data to the model path /data/results.

    Now i'm able to return as much elements by the backend service as required and the control displays every element properly as ComparisionData Element.

    Have a nice day.



    Add comment
    10|10000 characters needed characters exceeded

  • Aug 31, 2015 at 09:47 AM
    Add comment
    10|10000 characters needed characters exceeded

    • Former Member

      Hy Santhosh,

      thank for your reply. Unfortunatly it wasn't what i was looking for.

      Check out my latest reply on this topic. Solution is described there.

      Have a nice day.