Skip to Content
avatar image
Former Member

SAPUI 5- Two way binding Odata model in a table

Hi,

I am developing my first SAP UI5 application and have a table where i am using a switch for every row which should be disabled and only when the user selects each row should the switch be enabled for edit. I altered the odata model to hold a boolean value 'false' and bind it to the switch property however on changing the boolean value to true on click, the switch is still disabled.

This is my first app so wanted to walk through each step to know if i am doing things rights (i also read odata is one way bind by default but i changed as mentioned).

1) Fetch my Odata v2 model ( i am fetching my model via the manifest.json)in controller 1 and send it on a event bus to controller 2

var A= this.getOwnerComponent().getModel("something");
A.attachRequestCompleted(function(data) {
	var extractedList = A.getProperty("/");
	Object.keys(extractedList).forEach(key => {
	extractedList[key].isSwitchEnabled= false;
	})
});
var eventBus = sap.ui.getCore().getEventBus();
eventBus.publish("sendData", "onNavigateEvent", A);

2) in controller 2 i am associating it to my view :

var eventBus = sap.ui.getCore().getEventBus();
recievedData= eventBus.subscribe("sendData", "onNavigateEvent", this.onDataReceived, this);

onDataReceived: function(channel, event, data) {
data.setDefaultBindingMode(sap.ui.model.BindingMode.TwoWay);
var oTable = this.byId("myTable");
oTable.setModel(data);
},

onIndividualSelect: function(e) {
var selectedEntity = e.getParameter('listItem').getBindingContext().getObject();
selectedEntity.isSwitchEnabled= true;
},


3) My XML view looks like :

	<Table id="myTable" items="{/someItems}" mode="MultiSelect" selectionChange="onIndividualSelect">
<items>
  <ColumnListItem counter="0" id="item1">
   <cells>
   <Text id="A" text="{NAME}" titleActive="false" visible="true"/>
    <Text id="B" maxLines="0" text="{=${NAME2}.length >0 ? ${NAME2} : ${i18n     >noData} }"/>
     <Text id="C" maxLines="0" text="{=${NAME3}.length > 0 ? ${NAME3} : ${i1      8n>noData}}"/>
   <Switch state="false" customTextOn="X" customTextOff="Y" enabled ="{isSwitchEnabled}">
	<layoutData>
	   <FlexItemData growFactor="1"/>
			</layoutData>
</Switch>
</cells>
</ColumnListItem>
</items>

So from the onIndividualSelect i am trying to get the object and modify the property to true should this refelect in the view ? . Or have i grossly misunderstood something,

Add comment
10|10000 characters needed characters exceeded

  • Get RSS Feed

1 Answer

  • Nov 28, 2017 at 12:17 PM

    Hi,

    If it’s two way binding then definitely it’ll reflect in model when turn on and off the switch. For that you no need to any extra code.

    One more thing why you’re using Event Bus?

    Add comment
    10|10000 characters needed characters exceeded

    • Hi,

      If never changes then what exactly do you want?

      You can pass data using routing concept Click Here. or else set model in core in one controller and get that model in any other controller. below is the code.

      // In one controller
      sap.ui.getCore().setModel(yourDataObject, "modelName");
      
      // In other controller
      var data = sap.ui.getCore().getModel("modelName");