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.

Sources Description
Service Catalog

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

Application Settings

Data Binding – Object

Data Binding – Line Item

Step 6 : Confirmation

STEP 7 : Enjoy the results

Conclusion :

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.

New NetWeaver Information at

Very Helpfull

User Rating: Be the first one !