An insight into SAP Fiori Master-Detail Application (Template in SAP Web IDE) step by step
Introduction : The SAP Fiori Master Detail Application from Template can be a good help where a lot of code and configuration is auto generated but the wizard sends beginners into a tail spin as it is not crystal clear which input in the wizard will lead to what output.
Target audience : Beginners and experts alike.
Date created : 05.09.2016
Note for the readers : This is a living document and work in progress. I will be iteratively enhancing it. Do let me know via comments if you find anything missing or incorrect or your suggestions.
High level overview of the process
The most important steps are Data Connection and Template Customization. In Data Connection you specify a service to use for your application and in Template Customization you specify the fields to be used and where they will show up in the running application.
Step 1 : Create project from template
Step 2 : Template selection
Developer chooses the SAP Fiori Master-Detail Application template here.
Step 3 : Basic Information
Developer mentions the preferred project name and if this project is going to be a mobile application
Step 4 : Data Connection
Developer in this step specifies the service source.
Select SAP Gateway system and OData service.
|Workspace||Select local service from SAP WebIDE workspace|
|File System||Upload the service information from a local file system|
|Service URL||Copy your SAP Gateway service URL without host information.
You need to create Destinations to use this option.
For this example lets chose “Service URL” for an sample ES4 service. You will have to create a destination for the same details of which are explained in the following document :
An insight into Destinations for Northwind / ES4 services for use with SAP HCP / Web IDE
I am using the following OData Service :
This service is free to use but needs a one time registration but authentication every time you use it. The above links will help you through the process.
Step 5 : Template Customization
Data Binding – Object
Data Binding – Line Item
Step 6 : Confirmation
STEP 7 : Enjoy the results
Its interesting to note that this given combination of template customization settings works like a charm but I tried to change the fields other than given here and it failed with an error. I have not tried to trouble shoot it yet, remains in my TODO list.
where is the insight......
@Jun Wu - as I mentioned at the top this is a work in progress. As requested in the note for the readers, it would be great if you could provide your suggestions and it will be accomodated. Is there anything particular you were expecting but did not find here or were you not able to follow or generate the scenario with information provided here?
Hi, what happened to Fiori Master-Detail Template in WEB IDE on trial HCP platform?
I cannot select it. Instead, there is Fiori Master-Master-Detail!
It happened to me as well. I think there was some issue where only the old templates were available (e.g. Master-Master-Detail). I then noticed I was getting the new templates on one PC and old template on other PC. I have cleared the cache and now both PCs are getting the new templates
this is already very nice. But could you also provide a technical walktrough. I mean explain what is happening in the browser at all different points inside the different pages. This would be a great help on changing the app to do different things. Like,i am.searching on not dooing the initial dataload from the backend but have no,clue on where to start.