SAP ABAP RAP & Fiori Elements to refresh calculated fields without manual refresh ( Part – 2 )

The most common feature in building a transactional application is to calculate/ determine fields  based on input from dependent fields.

In real business scenario, these fields can be from same entity or different entities.

In this example, calculated field Total Price is from the Parent (Ex. Travel) entity while dependent fields are Booking Fee from same entity and Flight price from Child ( Ex. Booking ) entity. User expects to see the calculated Total Price on entering/updating the Booking Fee without refreshing the page.

In most of the tutorials, we get the information on building apps with ABAP RAP.

In Part – 1 blog post, Implementation is described when both of them are in same entity.

In this blog post, Implementation is described when both of them are in different entities.

Prerequisites:

• Knowledge on ABAP Restful Application Programming to build basic List Repost Application
• Knowledge on Entity Manipulation Language (EML) to build calculation/determination logic in Application Layer
• Hands on experience in OpenSAP course Building Apps with the ABAP RESTful Application Programming Model
• Create a Fiori app described in Part -1 blog post

Implementation:

1. Open the project created in previous blog in Business application Studio.
2. Navigate to Go to local annotation xml in the path webapp/annotations/annotation.xml
3. Add below annotations for Booking entity and place it after Travel entity.

   <Annotations Target="cds_zui_rap_travel_789.BookingType" >
   	<Annotation Term="Common.SideEffects" >
   		<Record >
   			<PropertyValue Property="SourceProperties" >
   				<Collection>
   					<PropertyPath>FlightPrice</PropertyPath>
   				</Collection>                            
   			</PropertyValue>
   			<PropertyValue Property="TargetEntities" >
   				<Collection >
   					<NavigationPropertyPath >to_Travel</NavigationPropertyPath>
   				</Collection>
   			</PropertyValue>
   		</Record>
   	</Annotation>
   </Annotations>

4. The complete file looks like below.
5. Explanation :
   • Annotation Term=”Common.SideEffects”
   • PropertyValue Property=”SourceProperties”
     • These are collections of properties that triggers determination of calculated property. In this example, it is Flight price from Booking entity
   • PropertyValue Property=”TargetEntities”
     • These are collection of entities that needs to be refreshed based on input of dependent property. In this example, Travel entity.
6.  Save the annotation file and preview the application .
7. The implementation is ready now and check the behaviour of Total price on
   • change of Flight price in Booking table in Travel page
   • change of Flight price in Booking page
8. Watch demo here. [ Video is compressed due to limitation of size ]

Now you learnt how dependent properties across entities can be refreshed automatically. Next challenge is to implement two such behaviours.