Show TOC

Configuring Card NavigationLocate this document in the navigation structure

All cards support navigation, both to a different SAP Fiori application using intent based navigation, and to external applications and websites via a direct URL which opens in a new browser tab. To trigger the navigation, users click or tap on a card header and in some cases, on an item within the card.

Navigation information is taken from the com.sap.vocabularies.UI.v1.Identification term.The com.sap.vocabularies.UI.v1.DataFieldForIntentBasedNavigation term should be used to define intent based navigation to SAP Fiori applications, and the com.sap.vocabularies.UI.v1.DataFieldWithUrl term should be used to configure navigation to external apps and websites.

The preferred way to configure intent based navigation is to use DataFieldForIntentBasedNavigation. However, in the case of navigation to a specific application route that is not configured as target mapping, you can also use DataFieldWithUrl to construct the specific application route. The overview page will identify that this is an intent based navigation and open the application in the relevant context, in the same tab.

Note that information about the single record selected can only be passed on to the navigation destination from list or table cards. To support this option, provide navigation configuration in the com.sap.vocabularies.UI.v1.LineItem term used by that specific card.

If more than one navigation record is provided in the com.sap.vocabularies.UI.v1.Identification or com.sap.vocabularies.UI.v1.LineItem terms, the first one will be used per term. The navigation records would be sorted according to importance, set in the com.sap.vocabularies.UI.v1.ImportanceType annotation, and their order of entry. The com.sap.vocabularies.UI.v1.Identification term can be configured in the application manifest file by setting the identificationAnnotationPath property with a qualifier, as shown in the example below. If the identificationAnnotationPath property is not configured, the com.sap.vocabularies.UI.v1.Identification term, without a qualifier, is used.

Sample Code
"sap.ovp": {
    ...
    "cards": {
        ...
        "card04": {
            "model": "ZCD204_EPM_DEMO_SRV",
            "template": "sap.ovp.cards.list",
            "settings": {
                "sortBy": "Price",
                "sortOrder": "descending",
                "listFlavor": "bar",
                "annotationPath": "com.sap.vocabularies.UI.v1.LineItem#bar",
                "identificationAnnotationPath": "com.sap.vocabularies.UI.v1.Identification#bar",
                "category": "{{card04_category}}",
                "entitySet": "Products"
            }
        },
        ...
    }
}