Skip to Content

Create and Expose a Core Data Service Based on a Database Table

Previous

Create and Expose a Core Data Service Based on a Database Table

By Merve Yalcin

Build a list report app with the ABAP RESTful programming model for SAP Fiori.

Details

You will learn

  • How to create a database table
  • How to create a Core Data Service

In this tutorial, wherever xxx appears, use a number (e.g. 000).


Step 1: Open Eclipse

Select to your ABAP package created in tutorial Create Simple Database Table for ABAP Environment and create a Core Data Services (CDS) data definition.
Open Eclipse

Please log in to access this content.
Step 2: Create data definition
  1. Search for data definition, select it and click Next.
    Create data definition

  2. Enter a name and a description for your data definition ZI_BOOKING_XXX.
    Create data definition

  3. Select a new transport request and click Next.
    Create data definition

  4. Select Define View template and press Finish.
    Create data definition

Please log in to access this content.
Step 3: Specify SQL view
  1. Specify the sql view name in the view definition as ZV_BOOKING_XXX.
    Specify SQL view

  2. Specify your data source after the select from statement as ztbooking_xxx.
    Specify SQL view

  3. Specify your data definition as shown below.
    The keyword key is used to specific a key element and the keyword as is used to define alias names. The two associations I_Country and I_Currency are defined and exposed in the projection. The element CurrencyCode is specified as currency key for the element Cost which is an amount field. The view entity is specified as searchable using the view annotation @Search.searchable: true and the element CustomerName is specified as default search element using the element annotation @Search.defaultSearchElement: true.

    @AbapCatalog.sqlViewName 'ZV_BOOKING_XXX'
    @AbapCatalog.compiler.compareFilter : true
    @AbapCatalog.preserveKey: true
    @AccessControl.authorizationCheck: #CHECK
    @EndUserText.label : 'Data Definition Booking'
    @Search.searchable : true
    define view ZI_BOOKING_XXX
       as select from ztbooking_xxx as Booking
       association [0..1] to I_Country  as _Country  on $projection.country = _Country.country
       association [0..1] to I_Currency as _Currency on $projection.CurrencyCode = _Currency.Currency
    
       {
         key booking              as Booking,
             @Search.defaultSearchElement: true
             customername         as CustomerName,
             numberofpassengers   as NumberOfPassengers,
             emailaddress         as EmailAddress,
             country,
             dateofbooking        as DateOfBooking,
             dateoftravel         as DateOfTravel,
             @Semantics.amount.currencyCode: 'CurrencyCode'
             cost,
             @Semantics.currencyCode: true
             currencycode          as CurrencyCode,
             lastchangedat         as LastChangedAt,
    
             _Country,
             _Currency       
    }
    

    Save and activate.

Please log in to access this content.
Step 4: Add UI annotation
  1. Go back to the data definition and used the @UI annotations to add the UI-specific semantics. Add following UI annotation in front of your data definition.
    Add UI annotation

    @UI: {
      headerInfo: {
      typeName: 'Booking',
      typeNamePlural: 'Bookings',
      title: { type: #STANDARD, value: 'Booking' }
      }
    }
    

  2. Replace your code with following:

    define view ZI_Booking_XXX
      as select from ztbooking_xxx as Booking
      association [0..1] to I_Country  as _Country  on $projection.country = _Country.Country
      association [0..1] to I_Currency as _Currency on $projection.CurrencyCode = _Currency.Currency
    {
    
          @UI.facet: [
            {
              id:       'Booking',
              purpose:  #STANDARD,
              type:     #IDENTIFICATION_REFERENCE,
              label:    'Booking',
              position: 10 }
          ]
    
    
          @UI: {
              lineItem: [ { position: 10, importance: #HIGH, label: 'Booking ID' } ],
              identification:[ { position: 10, label: 'Booking ID' } ]
              }
      key booking                                as Booking,
    
          @UI: {
            lineItem: [ { position: 20, label: 'Customer', importance: #HIGH } ],
            identification:[ { position: 10, label: 'Customer' } ]
          }
          @Search.defaultSearchElement: true
          customername                           as CustomerName,
    
          @UI: {
          lineItem: [ { position: 30, label: 'No of Passengers', importance: #HIGH } ],
          identification:[ { position: 30, label: 'No of Passengers' } ]
          }
          numberofpassengers                     as NumberOfPassengers,
    
          @UI: {
               identification:[ { position: 40, label: 'Email' } ]
           }
          emailaddress                           as EmailAddress,
    
          @UI: {
               identification:[ { position: 50, label: 'Country' } ]
           }
          country,
    
          @UI: {
               identification:[ { position: 60, label: 'Booked On' } ]
           }
          dateofbooking                          as DateOfBooking,
    
          @UI: {   identification:[ { position: 70, label: 'Traveling on' } ]    }
          dateoftravel                           as DateOfTravel,
    
    
          @UI: {
          lineItem: [ { position: 40, label: 'Cost', importance: #HIGH } ],
          identification:[ { position: 80, label: 'Cost' } ]
          }
          @Semantics.amount.currencyCode: 'CurrencyCode'
          cost,
    
          @UI: { identification:[ { position: 90, label: 'Currency' } ]     }
          @Semantics.currencyCode: true
          currencycode                           as CurrencyCode,
    
          @UI: { identification:[ { position: 100, label: 'Last Changed At' } ] }
          lastchangedat                          as LastChangedAt,
    
          //publich associations
          _Country,
          _Currency
    }
    

    Save and activate your data definition.

Please log in to access this content.
Step 5: Open other repository object

Right-click on your package and navigate to New > Other ABAP Repository Object from the appearing context menu.
Open other repository object

Please log in to access this content.
Step 6: Create service definition
  1. Search for service definition, select the appropriate entry and click Next.
    Create service definition

  2. Create a service definition and call it Z_I_BOOKING_XXX.
    Create service definition

  3. Click Finish to complete your transport request.
    Create service definition

Please log in to access this content.
Step 7: Expose entities

Expose the ZI_Booking_XXX and the I_Country view entities.

  @EndUserText.label: 'Service Definition for Booking'

  define service Z_I_Booking_XXX {
  expose ZI_Booking_XXX as Booking;
  expose I_Country  as Country;
  }

Save and activate your service definition.

Please log in to access this content.
Step 8: Open other repository object

Right-click on your package and navigate to New > Other ABAP Repository Object from the appearing context menu.
Open other repository object

Please log in to access this content.
Step 9: Create service binding
  1. Search for service binding, select the appropriate entry and click Next.
    Create service binding

  2. Create a service binding definition and call it Z_I_BOOKING_XXX.
    Create service binding

  3. Click Finish to complete your transport request.
    Create service binding
    Save and activate your service binding.

Please log in to access this content.
Step 10: Publish locally

Click Publish Locally to publish your service binding.
Publish locally

Please log in to access this content.
Step 11: Check your metadata
  1. Click on the created URL to see your result.
    Check your metadata

  2. Sign in with your communication user and password.
    Check your metadata

  3. Check your result:
    Check your metadata

Please log in to access this content.
Step 12: Open SAP Fiori elements view
  1. Go back to your service binding Z_I_BOOKING_XXX
    Open the preview for SAP Fiori elements app on the right side.
    Open SAP Fiori elements view

  2. Check your result:
    Open SPA Fiori elements view

Please log in to access this content.
Step 13: Open SAP Web IDE Full-Stack
  1. Switch to your SAP Cloud Platform subaccount, select Services and search for Web IDE Full-Stack to select it.
    Open SAP Web IDE Full-Stack

  2. Click Go to Service to switch to SAP Web IDE Full-Stack.
    Open SAP Web IDE Full-Stack

Please log in to access this content.
Step 14: Create SAP Fiori List Report Application
  1. Click on New Project from Template on the overview page.
    Create SAP Fiori List Report Application

  2. Select List Report Application and click Next.
    Create SAP Fiori List Report Application

  3. Insert following data to your list report application and click Next:

    • Project Name: Project_App_XXX
    • Title: My Application
    • Application Component Hierarchy: <your_component_hierachy>
    Create SAP Fiori List Report Application
  4. Click on Service Catalog and choose your system, which has already been created with your initial system setup. Search for your service Z_I_BOOKING_XXX, select it and click Next.
    Create SAP Fiori List Report Application

  5. Select following annotation and click Next.
    Create SAP Fiori List Report Application

  6. Select Booking for OData Collection and click Finish.
    Create SAP Fiori List Report Application

Please log in to access this content.
Step 15: Check your result
  1. Select your js file and click on the corresponding symbol to test your application.
    Check your result

  2. Click on your application Project_App_XXX to check your result.
    Check your result

Please log in to access this content.
Step 16: Test yourself

Write following UI annotation as a header Information:

  • typeName: Test
  • typeNamePlural: Tests
  • title:
  • type: #STANDARD
  • value: testyourself
×

Updated 09/14/2018

Time to Complete

10 Min.

Beginner

Prerequisites

  • SAP Cloud Platform ABAP environment user
  • Business Catalog SAP_CORE_BC_EXT_TST assigned to your business user
  • Initial development setup
Next
Back to top