Skip to Content
Author's profile photo Uladzislau Pralat

Fiori CRUD End to End Scenario

     There are many Fiori CRUD scenario implementations. How this one is different from others? It is based on SAP Template and represent best development practises. Besides of, it covers creation of CRUD OData Service and provides insight of what happens at back-end.

To begin with, create CRUD OData Service following Chandra Mahajan’s instructions in his blog. Please make a small change to ZUSERINFO_SRV ODataService to enable WebIDE template to see UserCollection Entity Set:

CRUD End to End 1.jpg

Note: if you do not have access to gateway system, then you can use cloud trial system as described in my blog.

 

Once CRUD OData Service is ready, proceed with Fiori application creation.

In HCP Cockpit create destination pointing to your gateway system (in my case it is ABAP 7.40 cloud trial system):

CRUD End to End 2.jpg

Then in WebIDE from menu choose File -> New -> Project from Template

CRUD End to End 3.jpg

Select SAP Fiori Application from Category drop down

CRUD End to End 4.jpg

Select CRUD Master-Detail Application template and click Next

CRUD End to End 5.jpg

Provide Basic Information and click on Next

CRUD End to End 6.jpg

Select you destination from drop down (NPL in my case)

CRUD End to End 7.jpg

Select ZUSERINFO_SRV from services drop down and click Next

CRUD End to End 8.jpg

Customize template as follows and click on Next

CRUD End to End 9.jpg

Click on Finish to complete project genetation

CRUD End to End 10.jpg

Note: generated Fiori application scope of functionality depends on DataService. Try to explore CRUD template with other services as well.

 

Run generated CRUD Fiori application

CRUD End to End 11.jpg


As you can see Query operation works providing a list of Users.

CRUD End to End 12.jpg

Click on Add button to test Create operation

CRUD End to End 13.jpg

Provide enter user details and press Save

CRUD End to End 14.jpg

Select just added entry and click Edit to test Update operation

CRUD End to End 15.jpg

Make changes and press Save

CRUD End to End 16.jpg

Finally test Delete Operation selecting the entry from master list and clicking Delete

CRUD End to End 17.jpg

Play with you generated Fiori CRUD application and explore it.

 

You can check data at back-end at any time in ZUSERINFO table.

CRUD End to End 19.jpg

You can also explore ZUSERINFO_SRV Data Service setting external break-points in OData Service implementation class. So during Fiori application execution it will take you in ABAP Debugger session.

CRUD End to End 20.jpg

Play with you back-end service enhancing it, for example, adding error handling for creation of duplicate entries.

CRUD End to End 21.jpg

Now if duplicated user entry is added, then Fiori provides a meaningful message

CRUD End to End 22.jpg

CRUD End to End 23.jpg

 

Assigned Tags

      30 Comments
      You must be Logged on to comment or reply to a post.
      Author's profile photo Hidayat Firmansyah
      Hidayat Firmansyah

      Hi Uladzislau Pralat

      thanks for your great tutorial 🙂

      I already follow all of your steps but,

      when I try to create a new entity or edit entity all of my forms always

      in not editable state.

      So I can't fill my form.

      Do you have any idea why I'm facing this problem?

      Kind Regards

      Firmansyah

      Author's profile photo Uladzislau Pralat
      Uladzislau Pralat
      Blog Post Author

      Hi Hidayat,

      have you tested your ZUSERINFO_SRV OData Service in Gateway Client (trx. /IWFND/GW_CLIENT) with POST and PUT methods (e.g. create and update records).

      Regards, Uladzislau

      Author's profile photo Hidayat Firmansyah
      Hidayat Firmansyah

      Hi Uladzislau Pralat

      ZUSERINFO_SRV OData Service in Gateway Client already tested,

      see the following image:

      fioricrud01.JPG

      fioricrud02.JPG

      Kind Regards

      Firmansyah

      Author's profile photo Hidayat Firmansyah
      Hidayat Firmansyah

      Hi Uladzislau Pralat

      I already solved my problem 🙂

      My input form properties (in create view) is in enabled="false" state by default.

      So, after I change this properties to "true" my apps works well for create and update .

      fioricrud03.JPG

      Kind Regards

      Firmansyah

      Author's profile photo Uladzislau Pralat
      Uladzislau Pralat
      Blog Post Author

      Hi Firmansyah,

      thank you for sharing your experience. The template get this enabled="false" property from OData Service definition (same as it requires entity set to be addressable see first image on my blog). You can play with properties of  OData Service and figure out what makes the template to generate enabled="false".

      Regards, Uladzislau

      Author's profile photo Former Member
      Former Member

      Hi Uladzislau,

      Thanks for the tutorial. It is helpful as step 2 after Chandra Mahajan's step by step blog . Can you please share steps to configure a tile for this app after deploying it?

      I found some blogs about configuring apps but they don't seem apt for this example.

      Regards,

      S

      Author's profile photo Uladzislau Pralat
      Uladzislau Pralat
      Blog Post Author

      Hi S. vyas,

      I was thinking to extend this tutorial up to Fiori launch Pad configuration, but unfortunately I do not have access to system SAP UI5 1.30  which Fiori Template requires. When I deployed to my system I have access to Fiori runs into error. It is too new version.


      Regards, Uladzislau

      Author's profile photo Uladzislau Pralat
      Uladzislau Pralat
      Blog Post Author
      Author's profile photo Srinivasan S
      Srinivasan S

      Hi Uladzislau,

      Thank you for the blog. But I am struck with a issue here. When I try to create a new ticket I am getting the popup (Sorry, a technical error occurred! Please try again later.) as you have mentioned but not able to see the details of the same.

      Please provide your suggestions on the same.

      Thanks,

      Srinivasan

      Author's profile photo Meera Vaishali
      Meera Vaishali

      Hi Uladzislau Pralat

      Great Blog. I Have completed all step as shown in Blog. And created launchpad using lpd_cust. How to create fiori apps.

      With Regards

      Meera

      Author's profile photo Uladzislau Pralat
      Uladzislau Pralat
      Blog Post Author
      Author's profile photo Abhishek Kumar
      Abhishek Kumar

      Hello Uladzislau Pralat,

      Could you please let me know how did you find the URL of the backend system, that you have used in creating the destination ?

      Many thanks for your input.

      Abhihsek

      Author's profile photo Meera Vaishali
      Meera Vaishali

      Hi Abhihsek

      Use the T-code: SICF and execute it.

      follow the path defaulthost/sap/opu/odata/

      right click odata and choose test services you will find the URL in your browser.

      With Regards

      Vaishali

      Author's profile photo Abhishek Kumar
      Abhishek Kumar

      Hello Meera Vaishali,

      When i test the odata it is giving me error The server has not found any resource matching the Data Services Request URI

      I took the same host name and port to create a destination with authentication but connection test is not successful.

      Thanks for your suggestion.

      Thanks,
      Abhishek

      Author's profile photo Meera Vaishali
      Meera Vaishali

      Hi Abhishek Sinha

      Can you give the screenhot for error which your getting

      with regards

      Vaishali

      Author's profile photo Abhishek Kumar
      Abhishek Kumar

      Hi Meera,

      I am getting below error when testing the odata.

      Error.png

      Author's profile photo Uladzislau Pralat
      Uladzislau Pralat
      Blog Post Author

      Hi Abhishek,

      I think, Request URI in Gateway Client is incorrect. Please provide screenshot.

      Regards, Uladzislau

      Author's profile photo Abhishek Kumar
      Abhishek Kumar

      Hi Uladzislau,

      Below is the screen short :

      URI.png

      for URL in destination i am using:

      http://<host_name>:<port>/sap/opu/odata

      Thanks,

      Abhishek

      Author's profile photo Uladzislau Pralat
      Uladzislau Pralat
      Blog Post Author

      Hi Abhishek,

      please make sure that Gateway is active and alias is assigned (this is what I had to configure in my system to make it work)

      Abhishek 1.jpg

      Abhishek 2.jpg

      Abhishek 3.jpg

      Abhishek 4.jpg

      Regards, Uladzislau

      Author's profile photo Abhishek Kumar
      Abhishek Kumar

      Hi Uladzislau,

      I checked in my system. Gateway is active and alias is maintained.

      In your example you said you have ABAP 7.40 cloud trial system.

      I have normal SAP system with SAP_GWFND Component.

      SAP_GWFND 740 0006 SAPK-74006INSAPGWFND SAP Gateway Foundation 7.40
      Author's profile photo Former Member
      Former Member

      Hi,

      Thanks for sharing the step by step procedure. You have mentioned to use cloud trail system and the corresponding link. but the link was broke, could you please provide alternative URL if any?

      Thanks
      Sravya

      Author's profile photo Uladzislau Pralat
      Uladzislau Pralat
      Blog Post Author

      Hi Sravya,

      I have updated the link. Please try again.

      Regards, Uladzislau

      Author's profile photo Khabir Ahmad Raja
      Khabir Ahmad Raja

      Hello every body I got some problem regarding OData requests. I want to send explicit OData requests like oModel.read() same like we do it in Eclipse but the problem is that how can I build an OData Model using Service Catalog? My Service Catalog is working fine.

      Author's profile photo Former Member
      Former Member

      Hi Everyone,

      Can we do similar App on SAP BW ?

      Our requirement is to get user inputs via excel uploads from desktop and manual CRUDS  and save them in BW for reporting purpose.

      If anyone has done this ( Fiori Apps on BW) please share your experience or elements required for it.

      Thanks in advance as this will be very helpful for us as we are very new to FIORI

       

       

      Author's profile photo Uladzislau Pralat
      Uladzislau Pralat
      Blog Post Author

      Hi Mukesh,

      any BW 7.4 and higher has built in Gateway and SAP UI5. You can definitely create Fiori Apps in BW. In one of my projects I used Fiori VizFrame and Fiori Launchpad Dynamic Tiles to create KPI Tiles similar to S/4 HANA KPI Tiles.

      Regards, Uladzislau

      Author's profile photo Former Member
      Former Member

      Thanks  Uladzislau,

      Do you also have some blogs on BW fiori ? or some high level Step by step to share.

      Thanks for your answer , this will help us to do POC on BW 7.4

      Author's profile photo Uladzislau Pralat
      Uladzislau Pralat
      Blog Post Author

      I will write a blog when I have time

      Author's profile photo Former Member
      Former Member

       

      Hi Uladzislau Pralat

      thanks for sharing such a great tutorial.

      I am following all your steps but,when I create a new fiori application it's showing wrong values instead of exact values which i have in my gateway system. But when I check the ODATA service i am getting proper values.

       

      Can you please help me to resolve this.

       

      Regards

      Nagamani

      Author's profile photo Uladzislau Pralat
      Uladzislau Pralat
      Blog Post Author

      Hi Nagamani,

      only I can think of is that you run the app with mock data.

      Regards, Uladzislau

      Author's profile photo Kutay BEKTAŞ
      Kutay BEKTAŞ

      Hello ,

      Thanks for amazing tutorial 🙂