Skip to Content
Technical Articles
Author's profile photo Xaver Groiss

Development of a Fiori Elements ‘Overview Page’ based on a RAP OData

I was curious on how to best implement an Fiori Elements ‘Overview Page’ Layout based on an OData Service exposed by our SAP BTP, ABAP Environment. After a little “googling” I found several Articles, Blogs, or UI5 Extensions Guides about Overview Pages but no concrete Guide on what the necessary Steps are to create a executable App. Here are the steps I found with some trial and error on how to create a Fiori Elements Overview Page based on a RAP-based OData V2 Service.


Necessary Technical Objects

A Service Binding wich exposes an UI – V2 OData Service, instead of an UI – V4 OData which is used for List-Object Page Apps.

I wasn’t able to get it running with UI – V4 Odata, maybe this isnt supported yet?



  1. I use the BAS Template Generator to select the Overview page Template.BAS%20Template%20Selection
  2. I select my relevant System and OData V2 Service
  3. Selection%20of%20OData%20V2%20ServiceAnd which Entity is the MainEntity where the Filter will be applied onFilterable%20Entity
  4. and then let it generate.
  5.  This will return an empty Overview Page.Empty%20Overview%20Page
  6. Using the Information shared in the UI5 SDK Article for Fiori Elements Extension Overview Page I was able to extend the manifest.json and add my first Table into the Overview Page.
"sap.ovp": {
    "globalFilterModel": "mainModel",
    "globalFilterEntityType": "<<<YourEntitySetHere>>>",
    "containerLayout": "resizable",
    "enableLiveFilter": true,
    "considerAnalyticalParameters": false,
    "cards": {
      "<<<YourCardName>>>": {
        "settings": {
          "addODataSelect": true,
          "entitySet": "<<<YourEntitySetHere>>>",
          "listFlavor": "standard",
          "listType": "extended",
          "showLineItemDetail": true,
          "sortBy": "<<<Field>>>",
          "sortOrder": "descending",
          "subTitle": "{{cardSubtitle}}",
          "title": "{{cardTitle}}",
          "defaultSpan": "auto"
        "model": "mainModel",
        "template": ""
    "disableErrorPage": false,
    "smartVariantRequired": true,
    "showBasicSearch": true,
    "refreshIntervalInMinutes": 5,
    "bHeaderExpanded": true


This is my current Endresult, defintly still a work in progress, but better than a blank Overview Page. 😛


My Current Overview Page


Its definitely cool to finally have a visible result, but it took alot of trial and error specifically with the OData – V2 and then with what coding is relevant in the Manifest.json. I would appreciate similar to the RAP feature Showcase, also a detailed Showcase for the Overview Page and its possibilities.


Thanks for reading, I will try and keep updating if I try additional Tricks in my Overview Page. 🙂 What have your experiences been with the Overview Page?


Assigned Tags

      You must be Logged on to comment or reply to a post.
      Author's profile photo Vivek Gupta
      Vivek Gupta

      Thank you for creating a blog on generating Overview Page application, its very good to see people are easily creating application using Fiori Elements.

      I would like to mention that Overview Page can be created not only with V2 service, but also with a V4 service. The steps is very much alike how application is created consuming a V2 service.

      Developing and Extending SAP Fiori Elements Apps :

      Author's profile photo Xaver Groiss
      Xaver Groiss
      Blog Post Author

      That's awesome, I will have to try it with a V4 Service. Thanks for the Link, while clicking through and reading some of the comments i found the following. Do you know if this still holds true, because that would explain my Issues with using OData V2 / V4?

      Best Regards,