Skip to Content
Author's profile photo Murali Shanmugham

Extending a Fiori App – Simple Use case – Part 1

I would like to share my experience in extending Fiori Apps and at the same time will show some of the significant steps which need to be performed when extending a Fiori App. As I got access to a CRM system, I will demonstrate with a simple use case as to what effort is required to add a field to one of the apps – “My Appointments”. “My Appointment” app typically displays the appointment records which can be displayed via CRMD_ORDER SAP GUI transaction.

Fiori Appointment Overview screen

/wp-content/uploads/2014/05/1_450375.jpg

Fiori Appointment Detail

screen

/wp-content/uploads/2014/05/2_450376.jpg

The counterpart SAP GUI transaction looks like below.

/wp-content/uploads/2014/05/3_450377.jpg

Let’s take an example where the requirement is to add few additional fields at the bottom of the Fiori Detail screen. The Category field is available in SAP GUI but not on Fiori screen.

To enhance this, there are three pieces of activities which need to be performed

  1. Extend the Standard Appointment OData service and put in the logic to retrieve the additional fields
  2. Extend the SAPUI5 Fiori Appointment application
  3. Display the new enhanced application to the user via the new Launchpad

I will cover the first topic in this article and the remaining as separate articles shortly

Extend the Standard Appointment OData service

It’s always good to start with SAP Help documentation to identify the components of each Fiori App.

http://help.sap.com/fiori_bs2013/helpdata/en/f4/394452aeeeb710e10000000a44176d/content.htm

Open the project in SEGW to explore the components.The Standard service which needs to be extended is “CRM_APPOINTMENT” and the entity is “Appointment”.

/wp-content/uploads/2014/05/4_450378.jpg

Before enhancing the service, please read the documentation on “Use cases for redefining OData Services” – http://help.sap.com/saphelp_gateway20sp08/helpdata/en/34/4e3d5269a2b610e10000000a44176d/content.htm?frameset=/en/3d/500cb8468d4534ae4130aecf680dbb/frameset.htm

Each entity is bound to an ABAP structure. From the help document, you should be able to find if there is an Include within the structure for extension. The Appointment entity is bound to the structure “CRMS_APPOINTMENT_ODATA” and it has an include “CRM_APPOINT_ODATA_INCL”. Add the new fields like Category within this structure.

/wp-content/uploads/2014/05/5_450379.jpg

With this, the DDIC part is enhanced. Next, create a new project as shown below in SEGW

/wp-content/uploads/2014/05/6_450380.jpg

Redefine it by using the below option

/wp-content/uploads/2014/05/7_450381.jpg

Provide the standard OData service as shown below

/wp-content/uploads/2014/05/8_450382.jpg

Select all the objects in the pop-up and you should see the below screen

/wp-content/uploads/2014/05/9_450386.jpg

Open the properties for the Appointment entity and add new entries for additional fields like Category.

Generate the project and provide values for the DPC/MPC classes

/wp-content/uploads/2014/05/10_450387.jpg

Add the Service via /IWFND_SERVICE_MAINT

/wp-content/uploads/2014/05/11_450389.jpg

After the service is added, you should be able to test by clicking on “Gateway Client”

/wp-content/uploads/2014/05/12_450388.jpg

In the gateway Client (/IWFND/GW_CLIENT) , retrieve the metadata of the service to confirm if the new fields have been added to the entity.

/wp-content/uploads/2014/05/13_450390.jpg

Next, we need to put some logic to populate the field values. Always look for enhancement spots to see if they meet the requirements. If not, open the  DPC_EXT Class (ZCL_MYAPPOINTMENT_DPC_EXT) class which was generated and redefine the APPOINTMENTSET_GET_ENTITY. If we were to add some fields to the Fiori overview screen, we would have to redefine the APPOINTMENTSET_GET_ENTITYSET (which returns a collection of Appointments for the list screen).

After analysing the code, You can have either of the below approaches within the methods which are to be redefined:

  1. Call the corresponding SUPER method to ensure that standard SAP code is executed. After invoking the SUPER method, you can add the custom code to perform operations for additional fields.
  2. Copy the standard code from the corresponding SUPER method and amend it with logic to perform operations for additional fields.

Keep in mind that SAP might be enhancing the standard structure by adding or removing fields in higher versions. Hence, we need to accordingly redefine the methods to minimize any impact during an upgrade.

/wp-content/uploads/2014/05/14_450391.jpg

Since there is a BADI – CRM_APPT_ODATA_BD within an Enhancement spot, we could use that BADI to put in our logic in the GET_APPOINTMENT method.

/wp-content/uploads/2014/05/15_450392.jpg

Once the data for additional fields are retrieved use the Gateway client to run the service and check if the collection of Appointments has the category details too.

/wp-content/uploads/2014/05/16_450393.jpg

It is very important to understand that before any OData service enhancements occur, it is best for the developer to debug the calls which come into the system from the Fiori App. Very often we make assumptions only to find at a later stage that the way in which the Fiori App makes a call to the backend is different to what we thought. For example a PATCH_ENTITY method could be invoked rather than an UPDATE_ENTITY. The way in which one Fiori App is developed may differ from another. It’s best to set a break point and explore how the calls come into the backend system.

The remaining parts of this article can be found in the below links.

Extending a Fiori App – Simple Use case – Part 2 (UI Extension)

Extending a Fiori App – Simple Use case – Part 3 (Launchpad Setup)

Assigned Tags

      20 Comments
      You must be Logged on to comment or reply to a post.
      Author's profile photo Masayuki Sekihara
      Masayuki Sekihara

      Good document. Thanks for sharing.

      Author's profile photo Krishna Kishor Kammaje
      Krishna Kishor Kammaje

      Thanks Murali for the document.

      Can you please explain this statement in more detail?

      "Keep in mind that SAP might be enhancing the standard structure by adding or removing fields in higher versions. Hence, we need to accordingly redefine the methods to minimize any impact during an upgrade."

      Since I have redefined version 0001, don't you think new changes which come with 0002 should not impact me? If not, how can I plan for this?

      Thanks

      Krishna

      Author's profile photo Murali Shanmugham
      Murali Shanmugham
      Blog Post Author

      Thanks Krishna. The version that I meant was the SP version. I have seen cases where when we upgrade from SP1-SP2-SP3 the version of the OData service remains  the same but there are new properties/function imports added to the service.

      My understanding is that the OData version will only change when there are some incompatible changes being made. As pointed out by you, if the version of the OData service changes, those new changes will not impact your redefined service which would still refer to the old version.

      Author's profile photo Former Member
      Former Member

      Thanks Murali...

      I dont know how to thank you for the wonderful document. I will go through rest of the parts for complete understanding..

      Thanks a ton again.

      SK

      Author's profile photo Former Member
      Former Member

      Thank you so much.. this is very helpful. 😘

      Author's profile photo Former Member
      Former Member

      Thanks a lot for this document. Really Helpful.

      Author's profile photo Brajesh Kumar
      Brajesh Kumar

      Thanks Mulali !!  Its really nice and well explained docs.. 🙂

      Author's profile photo Former Member
      Former Member

      Hi Murali,

           im extending the app Look Up Retail Product i have added my custom fields at RETAIL_ST_ARTICLE_INCL, but upon running the Look Up Retail Product Application it does not work anymore, if I delete the custom field the application works.

           this is the error it throws core-min-0.js:85 2016-04-15 16:58:18 The following problem occurred: HTTP request failed500,Internal Server Error,{"error":{"code":"/IWBEP/MC_SB_DPC_USR/004","message":{"lang":"en","value":"RFC call ended with \"Communication Failure\" exception (The function call of RETAIL_ST_GET_PRODUCTS failed; a field may have been assigned to the parameter ET_PRODUCTS whose type is not compatible with this parameter)."},"innererror":{"transactionid":"2FE802E65792F1D580BC000AF77AFE6A","timestamp":"20160415085815.1260000","Error_Resolution":{"SAP_Transaction":"Run transaction /IWFND/ERROR_LOG on SAP NW Gateway hub system and search for entries with the timestamp above for more details","SAP_Note":"See SAP Note 1797736 for error analysis (https://service.sap.com/sap/support/notes/1797736)"},"errordetails":[{"code":"/IWBEP/CX_SD_GEN_DPC_TECH","message":"RFC call ended with \"Communication Failure\" exception (The function call of RETAIL_ST_GET_PRODUCTS failed; a field may have been assigned to the parameter ET_PRODUCTS whose type is not compatible with this parameter)","propertyref":"","severity":"error","target":""}]}}} -

           Hope you can help.

      Author's profile photo Murali Shanmugham
      Murali Shanmugham
      Blog Post Author

      Hi Benedick,

      Sorry, I am not able to help. Its been a while since I last worked on Fiori Apps. Please post this question in the Forums and we will have someone to help you out. Thanks

      Author's profile photo Former Member
      Former Member

      Hi Murali,

           what forum shout I post this issue?

           Thank you.

      Author's profile photo Michael Appleby
      Michael Appleby

      Hi Benedick,

      Please create a new Discussion marked as a Question in the SAP Fiori community.  Should your question involve specific SAPUI5 coding, you may be better to create that Discussion in the SAPUI5 Developer Center community. 

      In general, unless you are asking for clarification/correction of some part of the Document, please create a new Discussion marked as a Question.  The Comments section of a Blog (or Document) is not the right vehicle for asking questions as the results are not easily searchable.  Once your issue is solved, a Discussion with the solution (and marked with Correct Answer) makes the results visible to others experiencing a similar problem.  If a blog or document is related, put in a link.  Read the Getting Started documents (link at the top right) including the Rules of Engagement. 

      NOTE: Getting the link is easy enough for both the author and Blog.  Simply MouseOver the item, Right Click, and select Copy Shortcut.  Paste it into your Discussion.  You can also click on the url after pasting.  Click on the A to expand the options and select T (on the right) to Auto-Title the url.

      Thanks, Mike (Moderator)

      SAP Technology RIG

      Author's profile photo Davide Del Monte
      Davide Del Monte

      Hello Murali, great article!

      Did you follow through other topics?

      1. Extend the SAPUI5 Fiori Appointment application
      2. Display the new enhanced application to the user via the new Launchpad

      Thank you very much!

      Author's profile photo Murali Shanmugham
      Murali Shanmugham
      Blog Post Author

      Thanks Davide, I just updated this article with the remaining links.

      Author's profile photo Former Member
      Former Member

      Hi Sir,

      I the above steps, you are speaking abt BADI

      BADI – CRM_APPT_ODATA_BD


      How did you find out the accurate BADI for your Odata Service(CRM_APPOINTMENT_SRV)?


      Is there any special way to find it. I am new Fiori and Odata


      Regards,

      Raghu

      Author's profile photo Jocelyn Dart
      Jocelyn Dart

      HI Raghu

      PLease raise this as a discussion in the SAP Fiori forum...you will get a quicker response that way

      rgds

      Jocelyn

      Author's profile photo Former Member
      Former Member

      Sure!!

      Author's profile photo Murali Shanmugham
      Murali Shanmugham
      Blog Post Author

      Please have a look at "App Extensibility: My Appointments - SAP Fiori 1.0 for SAP CRM - SAP Library".

      There should be a page on SAP Help for each App with regard to extensibility options.

      Regards,

      Murali.

      Author's profile photo Former Member
      Former Member

      Hello Murali Shanmugham,

      I Followed this above document for extending the fields, my custom project is working fine now after redefinition the standard,

      But Standard Project is showing some errors now, because of we redefined the standard i think so...


      Please suggest me  both projects can how to work.


      Thanks and Regards,

      Naresh Lodagala.

      Author's profile photo Samir Kulkarni
      Samir Kulkarni

      Hello Murali,

      Loved the way you explained this and it worked for me, however for an SD app. I have a doubt about the extension, when we upgrade the systems what will happen to these ?

      As in most of the enhancement options by SAP such as BADI are supported while upgrading the system to next patch level, or support pack level.

      I am a part time ABAP guys with major focus on UI technologies, so my question may sound like a noob to you. But it will be a great help if you can elaborate on this.

      If this is supportable in a way like BADI's are, this makes sense to go for using for most of the applications as they always have some need to add more entities to the existing Model.

      Regards,

      Samir

      Author's profile photo Former Member
      Former Member

      Hello Murali,

      Great article!!

      I have extended the fiori application HCM_TSH_MAN by replacing the view and it works perfect when I try to execute in SAP Web IDE and also deployed into our repository as a new application and successfully created the  new tile in the Fiori launchpad.

      But when I try to run the application both from FLP as well as BSP, it gives error "Unable to get property 'createRenderer' of undefined or null reference" in the index.html.

      Any help regarding this issue will be greatly appreciated.

      Thanks.