SAP Fiori Elements – Overview Page Part 2(Development of CDS view)

[AnkurBajpai]

Hi All,

As we already discuss on the fundamental of Overview Page in my previous blog. In this blog post we are going to develop CDS view on SAP S/4 Hana.

Pre-requisite- Please visit my previous blog for basic fundamentals-

SAP Fiori Elements – Overview Page Part 1(Introduction)

 

Let’s start how can we develop an SAP Fiori Elements application using CDS view and Annotations.

 

Steps to develop a CDS View for SAP Fiori Elements (Overview Page)-

Create CDS view-

Pre-requisite– We need ADT (ABAP Development Toolkit) in latest version of Eclipse. It is the recommended integrated development environment (IDE) for developing ABAP applications for SAP HANA. The ABAP Development Tools provide a set of powerful tools for developing ABAP applications.

• Install latest Eclipse version- http://www.eclipse.org/downloads/eclipse-packages/

 

• Install ABAP Development Tools for SAP NetWeaver plugin for the Eclipse- https://tools.hana.ondemand.com/neon/

 

1. Create an ABAP Project, using CTRL+ ALT+ SHIFT+ P in ABAP perspective-

• In the New ABAP Project dialog, select your SAP system from the list. Here my SAP system is S44.

• Click on “Next”.

• Click on “Next”.

• Enter your credentials and Click on “Finish”.

• Default Project is created with your user id.

2. Create a CDS view-

• Here we are going to create a CDS in the Local Object.

 

• To create CDS view, Right click on the newly created package($TMP) -> New -> Other ABAP Repository Object.

 

• Search for Data Definition -> Click on “Next”

• Enter “Name” and “Description” of CDS view -> Click on “Next”.

 

• We are doing only for Local Development. So, we are not going to assign our Object to any transport request -> Click on “Next”.

After clicking on next, the step “Validating package” might take a little while to complete.

• Click on “Define View” -> Click on “Finish”.

• Our default CDS view is created with template.

• Let’s change “sql_view_name” name and define a specific name (ZX_VW_SOITEMS_84) for your development.

• In our CDS view we are going to consume data from “vbap” table. Now our CDS view consumption is based on “vbap” table data.

 

• Press “CTRL + SPACEBAR” -> Here you get “Insert all elements- template” and fields, depends on your app requirement select field to show on app. Here I took these following fields.

• We can remove “mandt” field as we are using all clients. Now our CDS view look like this-

• Press “CTRL + S” to save the changes and “CTRL + F3” to activate CDS view.

 

• Now let’s create another similar CDS view for “Sales Orders”.

 

• Right click on the “Local Object ($TMP)” -> Other ABAP Repository Object -> Search for “Data Definition” -> Click on “Next”

• Enter CDS view “Name” and “Description” -> Click on “Finish”.

• Our default CDS view is created.

• Let’s change “sql_view_name” name

• Here our CDS view consumption is based on “vbak” table.

• Press “CTRL + SPACEBAR” to add required field columns for the app. Here I took these fields as per my requirements.

 

• Press “CTRL + S” to save the changes and “CTRL + F3” to activate the CDS view.

 

• Now we have CDS view for Header Item data and Line Item data, let’s connect our Header Item data with the Line Item data.

 

• The new join (association) has been created called _SOITEMS. This allow us to use the data in the Sales Order view to read related data from the Header Item table vbak and our existing sales order item CDS view ZXC_SOITEMS_84 respectively.

• Press “CTRL + S” to save the changes and “CTRL + F3” to activate the CDS view.

 

• Right click on “CDS” view (ZXC_SO_84) -> Open With -> Data Preview.

 





 

• Now we can see data like this. We have created our two CDS view successfully.

 

Next Step: 

SAP Fiori Elements – Overview Page Part 3(Development of OData Service)

Stay home stay safe☺️

 

 

 

Thanks,

Ankur Bajpai