Skip to Content
Author's profile photo Prasita Prabhakaran

SAP Fiori Overview Page – Navigation concepts

As you get your Overview Page application(OVP) ready with additional cards, you would next look for navigation from this overview information to complete the Insight to Action.

OVP supports navigation to other applications on click within card elements. To be specific, you can have a navigation defined at the card header, another defined for line items (table/list card) and for data points from a chart card. In all these cases, the navigations are defined in the following 2 annotations:

  1. com.sap.vocabularies.UI.v1.DataFieldForIntentBasedNavigation
  2. com.sap.vocabularies.UI.v1.DataFieldWithUrl

Intent Based Navigation

Intent based navigation is a concept provided by the Fiori Launchpad, To define Intent based navigation, you would have to specify the SemanticObject and Action. This combination is the “intent” of navigation, a sample is as follows:

http://<server>:<port>/<path>/FioriLaunchpad.html#AppArea-overview

Steps to set up navigation can be found here

Sample Annotation:

<Record Type="UI.DataFieldForIntentBasedNavigation">
    <PropertyValue Property="SemanticObject" String="SampleSemanticObject"/>
    <PropertyValue Property="Action" String="SampleAction"/>
</Record>

It may happen that you end up with an error on navigation using Semantic Object and action. The easiest way to validate this is to check if the url

http://<server>:<port>/<path>/FioriLaunchpad.html#SampleSemanticObject-SampleAction works fine.

If this does, then the corresponding navigation from OVP should work fine as well.

URL Based Navigation

To navigate to any other url either hardcoded or computed at runtime, this annotation can be used

Eg: www.google.com

Sample Annotation:

<Record Type="UI.DataFieldWithUrl">
    <PropertyValue Property="Url" String="www.google.com"/>
    <PropertyValue Property="Value" String="Search"/>
</Record>

This also allows parameters to be passed as shown below:

<Record Type="com.sap.vocabularies.UI.v1.DataFieldWithUrl">
    <PropertyValue Property="Label" String="Link to"/>
    <PropertyValue Property="Value" String="Google Maps"/>
    <PropertyValue Property="Url">
        <Apply Function="odata.fillUriTemplate">
            <String>https://www.google.de/maps/place/{street},{city}</String>
            <LabeledElement Name="street">
                <Apply Function="odata.uriEncode">
                    <Path>Address/Street</Path>
                </Apply>
            </LabeledElement>
            <LabeledElement Name="city">
                <Apply Function="odata.uriEncode">
                    <Path>Address/City</Path>
                </Apply>
            </LabeledElement>
        </Apply>
    </PropertyValue>
</Record>

Card Header Navigation

Navigation from card headers require you to define the annotation within Identification annotation, eg as follows:

<Annotation Term="UI.Identification">
	<Collection>
		<Record Type="UI.DataFieldWithUrl">
			<PropertyValue Property="Url" String="www.google.com"/>
			<PropertyValue Property="Value" String="Search"/>
		</Record>
	</Collection>
</Annotation>

Line Item Navigation

And in case of navigation from line item(applicable for list/table card) the annotation needs to be within lineitem annotation as shown below:

<Annotation Term="UI.LineItem">
	<Collection>
		<Record Type="UI.DataFieldForIntentBasedNavigation">
			<PropertyValue Property="SemanticObject" String="SampleSemanticObject"/>
			<PropertyValue Property="Action" String="SampleSemanticAction"/>
		</Record>
	</Collection>
</Annotation>

Navigation concept for stack cards

In case of stack cards, where you may need to navigate to different targets from left side of stack card, and from the quick view card header you can use the identification annotation with comma separated values as shown below:

"demo_OVPNavigationDemo_card01": {
	"model": "Northwind",
	"template": "sap.ovp.cards.stack",
	"settings": {
		"title": "{{demo_OVPNavigationDemo_card01_title}}",
		"entitySet": "Employees",
		"identificationAnnotationPath": "com.sap.vocabularies.UI.v1.Identification#stackHeader,com.sap.vocabularies.UI.v1.Identification#quickView"
	}
}

The first identificationAnnotationPath is used for navigation from the left side of the Stack Card. The second identificationAnnotationPath is used for navigation from the header and footer actions of QuickView Cards.

Navigation concept for Analytic cards

Starting SAPUI5 version 1.50, Analytic cards support Header Navigation and Data Point Navigation from chart area. Header navigation is same as defined for other cards. Data Point Navigation will lead to navigation to the same application as defined for the card header, but with selected data point as navigation parameter.

"demo_OVPNavigationDemo_card03": {
	"model": "Northwind",
	"template": "sap.ovp.cards.charts.analytical",
	"settings": {
		"title": "{{demo_OVPNavigationDemo_card03_title}}",
		"entitySet": "Employees",
		"chartAnnotationPath": "com.sap.vocabularies.UI.v1.Chart",
		"identificationAnnotationPath": "com.sap.vocabularies.UI.v1.Identification"
	}
}

Navigation parameters

Navigation parameters are supported to launch the target application with the relevant context.

When a card header is clicked, following details are passed to target application:

  1. Global Filters and global analytical parameters.
  2. Card Filters as defined in selection variant.
  3. Card Sort conditions as defined in presentation variant.
  4. Global custom filters provided from application breakout (Breakout function name: “getCustomAppStateDataExtension”).
  5. Custom parameters provided from application breakout (Breakout function name: “onCustomParams”).

On click of a line item in the OVP card, the context of the clicked line item is also passed in addition to the above data. And in case of chart cards, that of the selected data point.

Hope this helps to clear queries related to Navigation concepts for SAP Fiori Overview Pages. Look forward to your comments and feedback.

Assigned tags

      64 Comments
      You must be Logged on to comment or reply to a post.
      Author's profile photo Amit Agrawal
      Amit Agrawal

      Good writeup & very informative.

      Author's profile photo Abhi S
      Abhi S

      Thanks for sharing the info. I have one question -

      You mentioned in the blog "Starting SAPUI5  version 1.50, Analytic cards support Header Navigation and Data Point Navigation from chart area. Header navigation is same as defined for other cards. Data Point Navigation will lead to navigation to the same application as defined for the card header, but with selected data point as navigation parameter"

      Can you please share any example where I can do navigation based on data point. I have a column chart and would like to navigate by passing the parameters.

       

      Thanks!

      Abhi

       

       

      Author's profile photo Prasita Prabhakaran
      Prasita Prabhakaran
      Blog Post Author

      Hi Abhi,

      If you are using DataFieldForIntentBasedNavigation the dimension of the selected DataPoint will be passed on to the navigating app by default.

       

      Author's profile photo Pierfrancesco La Spada
      Pierfrancesco La Spada

      You mentioned in the blog “Starting SAPUI5  version 1.50, Analytic cards support Header Navigation and Data Point Navigation from chart area. Header navigation is same as defined for other cards. Data Point Navigation will lead to navigation to the same application as defined for the card header, but with selected data point as navigation parameter”

      Two questions Prasita Prabhakaran

      1. I see navigation from analytical cards (charts) is working also in UI5 version 1.42. I experienced it in Procurement Overview Page app; are there new features related to analytical cards navigation using UI5 version 1.50 or upper ?
      2. I am trying to implement DataPoint navigation for a Line Analytical Chart but I have a few problem. Is the Identification qualifier mandatory for the specific card in the manifest file for dataPoint navigation? In which position of the annotation file should the " >Record Type="UI.DataFieldForIntentBasedNavigation"> " (containing semantic object and action) annotation be placed? I tried to position it into the  <Annotation Term="UI.Chart" Qualifier="SpendTrend"> but it didn't work.

      Thanks for your help

      Author's profile photo Prasita Prabhakaran
      Prasita Prabhakaran
      Blog Post Author

      Regarding question 1. until UI5 version 1.50 chartNavigation would lead to the same target as the header.

      Starting 1,50 only header navigation is possible and the chart navigation will be disabled. Navigation type “chartNav” will not be possible now and is deprecated.

      The following property is set in the “settings” of the manifest file to achieve this. Not setting this property will result in the default data point navigation.

      “navigation” : “headerNav”

       

      Regarding query 2, this should be part of the identificationAnnotation:

      Eg:

      <Annotation Term="UI.Identification" Qualifier="Eval_by_Currency_Scatter">
         <Collection>
            <Record Type="UI.DataFieldForIntentBasedNavigation">
               <PropertyValue Property="Label" String="Go to Procurement Overview Page application" />
               <PropertyValue Property="Criticality"
                  EnumMember="UI.CriticalityType/Positive" />
               <PropertyValue Property="SemanticObject" String="OVP" />
               <PropertyValue Property="Action" String="Procurement" />
            </Record>
         </Collection>
      </Annotation>
      Author's profile photo Pierfrancesco La Spada
      Pierfrancesco La Spada

      Thanks for the details provided.

      Regards,

      Pierfrancesco

      Author's profile photo GAURAV SARDANA
      GAURAV SARDANA

      Hi Prasita,

      Can you provide an example for geolocations embedding in cards or overview page ? That would really helpful for me.

      Thanks in Advance.

      Gaurav

      Author's profile photo Prasita Prabhakaran
      Prasita Prabhakaran
      Blog Post Author

      Hi Gaurav,

      This would call for a custom card as of now. No standard examples are available.

      You can find info on custom cards here: https://help.sap.com/viewer/468a97775123488ab3345a0c48cadd8f/7.52.1/en-US/6d260f7708ca4c4a9ff45e846402aebb.html

       

      Author's profile photo Kaan Ozdogan
      Kaan Ozdogan

      Hi Prasita,

      We created custom cards and get data from XSJS services.

      How can append XSJS services to xsodata service? Is it possible?

      If no,

      How can we create annotation file for these XSJS services?

      I want to create annotation file for routing new page or application when card is pressed.

      Another question is that how can I refresh cards auto ?

       

      Best Regards,

      Kaan.

       

      Author's profile photo Prasita Prabhakaran
      Prasita Prabhakaran
      Blog Post Author

      Hello Kaan,

      I am not an expert with services, but for auto refresh of cards in OVP we have a manifest setting. Starting UI5 version 1.48 you can use refreshIntervalInMinutes in the manifest.json, to set the refresh interval(in minutes)

      The property should have a value more than or equal to 1 minute. If the refresh interval is set to less than 1, then the interval will be considered as 1 minute. If the value is more than 1, then the refresh interval is taken as specified by the user. After the specified minutes, the models will be refreshed and the card data will be reloaded.

      Author's profile photo Vijay Sharma
      Vijay Sharma

      Hi Prasita,

      I need your help Please.

      I have created an Overview page using Web Ide and I want to navigate to my custom KPI app on clicking the data point on analytical card. When I click on the card I get the error message "Navigation to this application is not supported."

      I searched about it but no luck . Please help to resolve this issue.What I have done is:

      - Provided the Semantic object and action of my KPI app under the UI identification annotation

      -created KPI app and is existing on the Launchpad and is running fine

      Below is the code snippet from Manifest.Jason of my OVP

      "card02": {
      "model": "ZS4_ENCONS_CDS",
      "template": "sap.ovp.cards.charts.analytical",
      "settings": {
      "title": "{{card02_title}}",
      "subTitle": "{{card02_subTitle}}",
      "entitySet": "ZS4_ENCONS",
      "selectionAnnotationPath": "com.sap.vocabularies.UI.v1.SelectionVariant",
      "chartAnnotationPath": "com.sap.vocabularies.UI.v1.Chart#ANNEBR",
      "dataPointAnnotationPath": "com.sap.vocabularies.UI.v1.DataPoint#EMPDBR",
      "identificationAnnotationPath": "com.sap.vocabularies.UI.v1.Identification#EMPDBR",
      "navigation": "dataPointNav"
      }
      },

      Below is snippet from Annotation file

      <Annotations Target="ZS4_ENCONS_CDS.ZS4_ENCONSType">
      <Annotation Term="UI.Identification" Qualifier="EMPDBR">
      <Collection>
      <Record Type="UI.DataFieldForIntentBasedNavigation">
      <PropertyValue Property="SemanticObject" String="empdetails"/>
      <PropertyValue Property="Action" String="analyzeSBKPIDetails"/>
      </Record>
      </Collection>
      </Annotation>
      <Annotation Term="UI.Chart" Qualifier="ANNEBR">
      <Record Type="UI.ChartDefinitionType">
      <PropertyValue Property="ChartType" EnumMember="UI.ChartType/Bar">
      <Annotation Term="Common.Label" String="Enabled by Region"/>
      </PropertyValue>
      <PropertyValue Property="Measures">
      <Collection>
      <PropertyPath>EnabledResources</PropertyPath>
      </Collection>
      </PropertyValue>
      <PropertyValue Property="MeasureAttributes">
      <Collection>
      <Record Type="UI.ChartMeasureAttributeType">
      <PropertyValue Property="Measure" PropertyPath="EnabledResources">
      <Annotation Term="Common.Label" String="EnabledResources"/>
      </PropertyValue>
      </Record>
      </Collection>
      </PropertyValue>

      Thanks

      Vijay

      Author's profile photo Prasita Prabhakaran
      Prasita Prabhakaran
      Blog Post Author

      Hi Vijay

      The easiest way to check this is to change the last part of your working ovp url as follows:

      https://xxx.yyy.zzz.corp/def#Application-displayOverviewPage (assume this is your ovp url) --> https://xxx.yyy.zzz.corp/def#empdetails-analyzeSBKPIDetails

      If this works, your navigation should work as well

      Look for typos in the semantic object action or authorisation issues.

      Author's profile photo Former Member
      Former Member

      Hi  Prasita Prabhakaran

      I am trying to navigate to KPI app(Standard Fiori app : Value Contract Consumption) from OVP table card and facing below issue.

      I have added semantic object and action as below.

      <Annotation Term=”UI.Identification” Qualifier=”lineitemnav”>
      <Collection>
      <Record Type=”UI.DataFieldForIntentBasedNavigation”>
      <PropertyValue Property=”SemanticObject” String=”PurchaseContract”/>
      <PropertyValue Property=”Action” String=”analyzeValueContractCnsmpn”/>
      </Record>
      </Collection>
      </Annotation>

      “sap.ovp”: {
      “globalFilterModel”: “ZPPM_INPUT_QUERY_SRV”,
      “globalFilterEntityType”: “ZPPM_INPUT_QUERYResult”,
      “enableLiveFilter”: true,
      “considerAnalyticalParameters”: false,
      “cards”: {
      “card00”: {
      “model”: “ZPPM_INPUT_QUERY_SRV”,
      “template”: “sap.ovp.cards.table”,
      “settings”: {
      “title”: “{{card00_title}}”,
      “entitySet”: “ZPPM_INPUT_QUERYResults”,
      “addODataSelect”: false,
      “annotationPath”: “com.sap.vocabularies.UI.v1.LineItem#tablecard”,
      “identificationAnnotationPath”: “com.sap.vocabularies.UI.v1.Identification#lineitemnav”
      }}}}

      When I run the app from web ide , it says “Navigation to this application is not supported.”

      When I try to deploy the app to ABAP repository I am getting this error “Cannot read property ‘indexOf’ of undefined”.

      As per your comments, I tried to test with below URL

       

      https://xxxx/fiori#PurchaseContract-analyzeValueContractCnsmpnNot working

      https://xxxx/fiori#PurchaseContract-analyzeValueContractCnsmpn?EvaluationId=.SAP.MM.PUR.VALUECONTRACTCNSMPN.EVALIts working with the parameter

      In this case how to add the property in UI annotation.

      Any help would be grateful.

      Thanks,

      Vasantham

       

      Author's profile photo Prasita Prabhakaran
      Prasita Prabhakaran
      Blog Post Author

      In this case please check for any further console errors. A common error case is when the batch call fails due to missing mandatory parameter.

      Author's profile photo Vijay Sharma
      Vijay Sharma

      Hi Prasita,

      I checked for Typos and there is none. Also, i am able to access the KPI as a standalone application , so i believe should not be an authorization issue as well.

      Is it something we are missing for the custom KPI app to workthrough OVP navigation?

       

      Thanks

      Vijay

      Author's profile photo Prasita Prabhakaran
      Prasita Prabhakaran
      Blog Post Author

      Please check for further console errors on click of the link.  Does it expect a mandatory parameter?

      Author's profile photo Vijay Sharma
      Vijay Sharma

      Thanks Prasita for the response.

      No, Custom KPI with details is not expecting any parameter. The only thing i noticed is that, if i manually add the evaluation id to the URL , it opens the KPI. But i don't know how can this be passed from the Overview card automatically.

      https://xxx.yyy.zzz.corp/def#SemObj1-Display?EvaluationId='E.XYZ'

      Appreciate your help with this.

      Regards

      Vijay

       

      Author's profile photo Sowmya Junju
      Sowmya Junju

      Hi Vijay,

      i know it is a long time ago, but were you able to pass evaluation id to KPI?

       

      Author's profile photo Pierfrancesco La Spada
      Pierfrancesco La Spada

      Hi Prasita,

      thanks for the very useful post.

      I have a question about navigation parameters:

      when passing a parameter to a target application, how is the match "source-parameter -> target-parameter" solved by the system? Is it based on field name, field data type or defined in target mapping of the semantic object / action ?

       

      Thanks,

      Pierfrancesco

      Author's profile photo Prasita Prabhakaran
      Prasita Prabhakaran
      Blog Post Author

      Hello Pierfrancesco,

      The parameters(both passed via url and the app state) are applied in the target application based on the relevant implementation in the target application.

       

      Author's profile photo Pierfrancesco La Spada
      Pierfrancesco La Spada

      Hello Prasita,

      Thanks for your answer.

      The procedure you provided works for most of the object developed in UI5 but It seems doesn't work for Overview Page.

      Also trying to hardcoding the URI of a standard Overview Page (ex. Procurement Overview Page) parameters value in the Uri are not passed to Smart Filter Bar.

      Do you have any idea of how implementing it?

       

      Thanks

      Author's profile photo Prasita Prabhakaran
      Prasita Prabhakaran
      Blog Post Author

      Hello Pierfrancesco,

       

      In this case is the OVP the target application?

      Author's profile photo Pierfrancesco La Spada
      Pierfrancesco La Spada

      Yes, exactly

      Author's profile photo Prasita Prabhakaran
      Prasita Prabhakaran
      Blog Post Author

      Hello  Pierfrancesco,

      Request you to share the details on the parameters passed and some info on business case that requires OVP to be the target application would be helpful as well

       

      Author's profile photo Allan Jason Mercado
      Allan Jason Mercado

      Hi Prasita,

      First of all great guide, been following your posts regarding OVP.

      Hope you can help with the navigation of my OVP.

      I am trying to add a Link List card that will serve as a Quick Link window in the OVP. The items in the card is clickable but once clicked it is doing nothing.

      " Annotation
      <Annotations Target="ZTM_TEST_SRV.QuickLink">
      <Annotation Term="UI.Identification" Qualifier="QL_Semantic">
      <Collection>
      <Record Type="UI.DataFieldForIntentBasedNavigation">
      <PropertyValue Property="SemanticObject" Path="SemanticObject"/>
      <PropertyValue Property="Action" Path="Action"/>
      </Record>
      </Collection>
      </Annotation>
      <Annotation Term="UI.HeaderInfo" Qualifier="QL_Header">
      <Record Type="UI.HeaderInfoType">
      <PropertyValue Property="TypeName" String="{@i18n&gt;title_link}"/>
      <PropertyValue Property="TypeNamePlural" String="{@i18n&gt;title_links}"/>
      <PropertyValue Property="Title">
      <Record Type="UI.DataField">
      <PropertyValue Property="Value" Path="Title"/>
      </Record>
      </PropertyValue>
      </Record>
      </Annotation>
      </Annotations>

      " Card
      "com_test_home_QL": {
      "model": "TestModel",
      "template": "sap.ovp.cards.linklist",
      "settings": {
      "title": "{{com_test_home_TestHome_card01_title}}",
      "entitySet": "QuickLinkSet",
      "listFlavor": "standard",
      "identificationAnnotationPath": "com.sap.vocabularies.UI.v1.Identification#QL_Semantic",
      "headerAnnotationPath": "com.sap.vocabularies.UI.v1.HeaderInfo#QL_Header"
      }
      }

      If you can please check if you see any problems with the annotation and card above.

      I have tried accessing the URL with the below format and it works fine.

      http://<server>:<port>/<path>/FioriLaunchpad.html#SampleSemanticObject-SampleAction

      Also, if I use the same properties in a List Card navigation to other objects works fine the problem is when using Link List Card.

      Thanks in advance.

       

      Regards,

      Aljay

      Author's profile photo Prasita Prabhakaran
      Prasita Prabhakaran
      Blog Post Author

      This is the correct usage, please try the following:

      <PropertyValue Property=”SemanticObject” String=”SemanticObject”/>
      <PropertyValue Property=”Action” String=”Action”/>

      Author's profile photo Akshaya Parthasarathy
      Akshaya Parthasarathy

      Can we pass semantic object parameters through annotation?

      Author's profile photo Prasita Prabhakaran
      Prasita Prabhakaran
      Blog Post Author

      Please elaborate your use case

      Author's profile photo Magina Zhang
      Magina Zhang

      Hi Prasita,

       

      thank you very much for sharing your knowledge!

       

      I met an issue when doing intent-based-navigation in "List Card", would you please help to look it?

      I am using CDS View based annotation, in there I marked a field with navigation:

      @UI: {
      lineItem: [
      {
      position: 10,
      qualifier: 'RecordInExpirationOrder',
      importance: #HIGH,
      label: 'Change Record'
      }
      ]
      }
      @Consumption.semanticObject: 'ChangeRecord'
      ChangeRecord,

       

      when I perform selection in my list card, as you mentioned, all fields(includes some meaningless fields) in that CDS view will be taken together as parameters when navigating to target applications.

      the target application is a smart template one, which has "list report page" and "object page", what I expect is, when doing the navigation, it should bring me to the "object page" of selected "Change Record".

      however, the navigation is not possible with all that parameters, do you know where should I make the change to enable that?

       

      also, is that possible to set only one field in the list card as navigatable, rather than the entire entry?

      I suppose that will work as it will only bring related context when performing navigation

       

      BR, Magina

      Author's profile photo Prasita Prabhakaran
      Prasita Prabhakaran
      Blog Post Author

      Hello Magina,

      You can make use of the "addODataSelect": "true", in cardSettings. This will ensure that only the fields included in the lineItem annotation are passed during navigation.

      Alternatively, you may make use of Custom Navigation Parameters as described here : https://help.sap.com/doc/468a97775123488ab3345a0c48cadd8f/7.52.0/en-US/40051b67edaf457cad37d552c37b497d.html

      Author's profile photo Richard Brünning
      Richard Brünning

      Hi Prasita,

      at the moment I have configured a list card with intend based navigation on header level. I now want the intend based navigation also on item level, but i need some URL parametes.

      sample:

      Header Level:  #MyQuotation-display

      Item Level #MyQuotation-display?/QuotationSet/00505692-6481-1ed7-adb1-437786d6fa9f

      Some ideas on that?

      Author's profile photo Prasita Prabhakaran
      Prasita Prabhakaran
      Blog Post Author

      Hello Richard,

      The context of the selected line item will be passed by default. If you wish to add custom parameters you can make use of the extension provided for the same. You can find further info on this here

      Author's profile photo Richard Brünning
      Richard Brünning

      Hi,

      this did not work because my target app use other parameter format (Master Detail Template). But i found a solution to use URL based Annotation for Intend based Navigation Path

      <Record Type="UI.DataFieldWithUrl">
        <PropertyValue Property="Value" Path="URL"/>
           <PropertyValue Property="Url">
      	<Apply Function="odata.fillUriTemplate">
      		<String>#MyQuotation-display&amp;/QuotationSet/{guid}</String>
      			<LabeledElement Name="guid">								 
                                        <Path>Guid</Path>
      			</LabeledElement>
      	</Apply>
         </PropertyValue>
      </Record>
      Author's profile photo Krishna Kishor Kammaje
      Krishna Kishor Kammaje

      If anyone is interested, I have expanded on OVP Navigation concepts here. https://blogs.sap.com/2018/08/20/navigation-from-a-fiori-ovp/

      Author's profile photo Tejas Chouhan
      Tejas Chouhan

      Hi Prasita,

      Thanks for the blog. In my app, I am calling UI.DataFieldWithIntentBasedNavigation” and it is calling the list report column as hyperlink. This column looks repeated as 1 from CDS is non hyperlink and one from annotation is. So i have 2 columns with same data.Not sure if i am doing wrong.

      Also can you help me on how to navigate to another app using semantic object and action , do i have to specify the parameters somewhere in annotation while using above annotation? Or it carries automatically ?

      Regards,

      Tejas

      Author's profile photo Prasita Prabhakaran
      Prasita Prabhakaran
      Blog Post Author

      Hello Tejas,

      In OVP we only support DataFieldForIntentBasedNavigation. The context of the selected line item, plus the global filters and selection variant applied on the card are carried over to the target application by default.

      Author's profile photo Anjanikumar Dubey
      Anjanikumar Dubey

      we are using intent based navigation, in our overview page. now we want to navigate to standard analytical application.

      below it he URL on which i want to navigate, can you please help me into this to pass Evaluation ID with Semantic Object and action.

      URL:-

      https://fiori-system_url:port/fiori#DaysPayablesOutstandingKPI-analyzeSBKPIDaysPayablesOutstanding?EvaluationId=.SAP.AP.DPO.LAST12MONTH

      where
      Semantic Object-DaysPayablesOutstandingKPI
      Action - analyzeSBKPIDaysPayablesOutstanding
      Additional we need to add in URL is - EvaluationId =.SAP.AP.DPO.LAST12MONTH

       

      BR,

      Anjani

      Author's profile photo Prasita Prabhakaran
      Prasita Prabhakaran
      Blog Post Author

      If your card has IntentBasedNavigation then you can pass Static Parameter's to the navigation application by adding the following manifest settings for the card.

      • Add a property "staticParameters" inside card settings.
      • "staticParameters" is a simple object containing key value pairs denoting the navigation parameters
      Author's profile photo Anjanikumar Dubey
      Anjanikumar Dubey

      Hi Prasita,

      Thank you for your quick response, but can please provide any link or eg. to add ststic parameter in card?

       

      BR,

      Anjani

      Author's profile photo Prasita Prabhakaran
      Prasita Prabhakaran
      Blog Post Author

      The manifest card setting for static parameters would look like this:

      "card002": {
        "model": "sampleModel",
        "template": "sap.ovp.cards.list",
        "settings": {
          "title": "Sample Title",
          "listType": "condensed",
          "entitySet": "EntitySet",
          
          "staticParameters": {
            "Param1": "Value1",
            "Param2": "Value2"
          }
        }
      }
      
      
      Author's profile photo Anjanikumar Dubey
      Anjanikumar Dubey

      or can we use any other navigation so that i can use Evaluation ID in my URL?

      Author's profile photo Anjanikumar Dubey
      Anjanikumar Dubey

      Thank you Prasita Prabhakaran. it works. issue was this parameter was mandatory, so we removed check from catalog and after that it start working.

      Author's profile photo Ranjeeta Hangal
      Ranjeeta Hangal
      Hi Prasita Prabhakaran
      It's very informative blog,

      Need some more information from you  about the navigation from other apps to OVP. As per our requirement I’m able to navigate from another app to OVP and the required object is passing through Url.

      Could you please help me to understand how to get the data/ parameters in custom card controller from Url?

      Author's profile photo Janith Illangakoon
      Janith Illangakoon

      Hi thanks for the blog post.

      I've managed to navigate to another app using intent based navigation.

      Is there any way to navigate to another page of the target application. eg: to a object page if an application. my URL as follows.

      semantic object  - apptargetapp

      Action - Display

      Second page - detailpage

      Url like - apptargetapp-Display/detailpage

       

      Author's profile photo akshaya parthasarathy
      akshaya parthasarathy

      Hi Prasita,

      I want to navigate from my list card to an object page of another list report application. Is that possible?

      Author's profile photo Prasita Prabhakaran
      Prasita Prabhakaran
      Blog Post Author

      Yes this is the classic case of navigation from a list card --> line item.

      Author's profile photo akshaya parthasarathy
      akshaya parthasarathy

      Thanks a lot Prasita. I tried this, but it displays as blank lineitems. Also I tried DataFieldWithIntentBasedNavigation and it also displayed blank values. Even mock data did not work. Can You please help me where Im going wrong?

       

      <Annotation Term="UI.LineItem">
      					<Collection>
      						<Record Type="UI.DataFieldForIntentBasedNavigation">
      							<PropertyValue Property="SemanticObject" String="newApp"/>
      							<PropertyValue Property="Action" String="display"/>
      							<PropertyValue Property="RequiresContext" Bool="true"/>
      						</Record>
      					</Collection>
      				</Annotation>

       

      Author's profile photo Akshaya Parthasarathy
      Akshaya Parthasarathy

       

      Hi Prasita

       

      1. Custom parameters provided from application breakout (Breakout function name: “onCustomParams”).. This function will it be called when i click using datafieldwithurl?
      Author's profile photo Prasita Prabhakaran
      Prasita Prabhakaran
      Blog Post Author

      Yes it should be invoked.

      Author's profile photo Akshaya Parthasarathy
      Akshaya Parthasarathy

      Hi Prasita,

      I want to navigate from my custom card to an object page. How can it be done?

      Author's profile photo Prasita Prabhakaran
      Prasita Prabhakaran
      Blog Post Author

      This needs to be implemented as ovp-lib does not influence the behaviour within the custom card

      Author's profile photo Akshaya Parthasarathy
      Akshaya Parthasarathy

      Hi Prasita Prabhakaran

      Im trying to navigate from a list card lineitem and pass some parameters to it. But onCustomParams method does not get invoked when I click on the line item the first time.

      If i click the header once and then click on line item it gets invoked.

      Can you please help with this?

      Author's profile photo Prasita Prabhakaran
      Prasita Prabhakaran
      Blog Post Author

      It is expected to be invoked each time, if you see an issue please report the same via a customer incident.

      Author's profile photo Thomas Maatz
      Thomas Maatz

      Hi Prasita Prabhakaran,

      Im trying to navigate from a donut card detail item to a specific URL. I’m currently using your example as shown below.

      <Record Type="com.sap.vocabularies.UI.v1.DataFieldWithUrl">
          <PropertyValue Property="Label" String="Link to"/>
          <PropertyValue Property="Value" String="Google Maps"/>
          <PropertyValue Property="Url">
              <Apply Function="odata.fillUriTemplate">
                  <String>https://www.google.de/maps/place/{street},{city}</String>
                  <LabeledElement Name="street">
                      <Apply Function="odata.uriEncode">
                          <Path>Address/Street</Path>
                      </Apply>
                  </LabeledElement>
                  <LabeledElement Name="city">
                      <Apply Function="odata.uriEncode">
                          <Path>Address/City</Path>
                      </Apply>
                  </LabeledElement>
              </Apply>
          </PropertyValue>
      </Record>

      I defined the annotation via the MPC-Method “DEFINE_VOCAB_ANNOTATION” in the backend. It start to navigate correctly but i always get a “null” for the processed odata parameters. Here my coding from mpc method.

       lo_annotation = lo_ann_target->create_annotation( iv_term = 'com.sap.vocabularies.UI.v1.Identification' ).    "#EC NOTEXT
          lo_collection = lo_annotation->create_collection( ).
          lo_record = lo_collection->create_record( iv_record_type = 'com.sap.vocabularies.UI.v1.DataFieldWithUrl' ).    "#EC NOTEXT
      
          lo_property = lo_record->create_property( 'Label' ).   "#EC NOTEXT
          lo_simp_value = lo_property->create_simple_value( ).
          lo_simp_value->set_path( 'Lifnr' ).    "#EC NOTEXT
      
          lo_property = lo_record->create_property( 'Value' ).   "#EC NOTEXT
          lo_simp_value = lo_property->create_simple_value( ).
          lo_simp_value->set_path( 'Lifnr' ).    "#EC NOTEXT
      
          lv_url = 'http://www.google.de/{Lifnr}'.
          lo_property = lo_record->create_property( 'Url' ).   "#EC NOTEXT
      
          lo_function = lo_property->create_function('odata.fillUriTemplate').
          lo_fun_param = lo_function->create_parameter( ).  "#EC NOTEXT
          lo_simp_value = lo_fun_param->create_simple_value( ).
          lo_simp_value->set_string( lv_url ).
      
          lo_fun_param = lo_function->create_parameter( ).  "#EC NOTEXT
          lo_label_elem = lo_fun_param->create_labeled_element( 'Lifnr' ).
          lo_function = lo_label_elem->create_function('odata.uriEncode').
          lo_fun_param = lo_function->create_parameter( ).
          lo_simp_value = lo_fun_param->create_simple_value( ).
          lo_simp_value->set_path( 'Lifnr' ).
      
      

      While looking on the metadata file via browser tools, for me everything looks good so far.

      <Annotation Term="com.sap.vocabularies.UI.v1.Identification">
      <Collection>
      <Record Type="com.sap.vocabularies.UI.v1.DataFieldWithUrl">
      <PropertyValue Property="Label" Path="Lifnr"/>
      <PropertyValue Property="Value" Path="Lifnr"/>
      <PropertyValue Property="Url">
      <Apply Function="odata.fillUriTemplate">
      <String>http://www.google.de/{Lifnr}</String>
      <LabeledElement Name="Lifnr">
      <Apply Function="odata.uriEncode">
      <Path>Lifnr</Path>
      </Apply>
      </LabeledElement>
      </Apply>
      </PropertyValue>
      </Record>
      </Collection>
      </Annotation>
      </Annotations>

      I was trying to change Odata-Parameter with an without entity name…

      Do you have any idea?

      Thanks in advance

      Thomas

       

       

      Author's profile photo Thomas Maatz
      Thomas Maatz

      in manifest file i defined ovp card like this

       

      	"sap.ovp": {
      		"globalFilterModel": "BW",
      		"globalFilterEntityType": "GlobalFilter",
      		"containerLayout": "resizable",
      		"enableLiveFilter": true,
      		"considerAnalyticalParameters": true,
      		"cards": {
      			"card01": {
      				"model": "BW",
      				"template": "sap.ovp.cards.charts.analytical",
      				"settings": {
      					"title": "{{card01_title}}",
      					"entitySet": "GTCPSet",
      					"chartAnnotationPath": "UI.Chart",
      					"idenfiticationAnnotationPath": "com.sap.vocabularies.UI.v1.Identification",
      					"addODataSelect": true,
      					"navigation": "dataPointNav",
      					"enableScalingFactor": "true"
      				}
      			}
      		},
      		"sap.platform.abap": {
      			"uri": "/sap/bc/ui5_ui5/mm61_ovp_bc/webapp",
      			"_version": "1.1.0"
      		}
      	},
      	"sap.platform.abap": {
      		"uri": "/sap/bc/ui5_ui5/mm61_ovp_bc/webapp",
      		"_version": "1.1.0"
      	}
      }
      Author's profile photo Prasita Prabhakaran
      Prasita Prabhakaran
      Blog Post Author

      I am not an expert on the topic, shall look for references that might be useful here

      Author's profile photo Thomas Maatz
      Thomas Maatz

      Hey thanks for your answer. Do you know a expert regarding to this topic? Maybe i should create a OSS notification for this...

       

      Author's profile photo Samuele Barzaghi
      Samuele Barzaghi

      Hi Thomas Maatz,

      I have the same problem, have you solved?

      Thanks Sam

      Author's profile photo Thomas Maatz
      Thomas Maatz

      Hi Samuele Barzaghi,

      depending your UI5-Version it is not possible to use OData-Parameters via URL Based Navigation. I changed to sematic object navigation instead.

       

      BR

      Thomas

      Author's profile photo Samuele Barzaghi
      Samuele Barzaghi

      Hi Thomas Maatz,

      Thank you for answer.

      I'm trying with 1.76 and 1.77 but the OData parameter is always null (null if I use the parameter for the "url" property, when I use as "value" property I can see the correct value).

      https://github.com/SAP-samples/cloud-cap-samples/issues/65

      I should open an incident too.

      Regards,

      Sam

      Author's profile photo Rahul Lohia
      Rahul Lohia

      Hi Prasita,

       

      Thank you for all the information! I went through the blog as well as the questions, but I have an issue while using the UI.DataFieldWithUrl on a LineItem of my entity. I have prepared the URL from backend and the column is rendered correctly as a hyperlink. The only issue, is that the URL doesnt open in a new window and I cannot see any other annotation to specify the target.

      The documentation mentions 'An m.Link control is rendered for the property on the list report or object page (if it's in Display mode)' but the 'target' attribute is empty, which should be '_blank' for the URL to open in a new tab.

      Can you please advise how to achieve this requirement?

       

      Thanks,

      Rahul

      Author's profile photo Wendy Chen
      Wendy Chen

      Hi Prasita,

      For the Intent Based Navigation in Card Header, the global filters work perfectly.

      We want to use URL Based Navigation in card header because the target apps are not deployed in the same portal with the overview page app, and the global filters are also needed in those URL Based Navigation, but it seems (at least in 1.65.3), the global filters and custom parameters are not working for URL Based Navigation.

      Is this supported in latest version? or how can we pass the custom parameters in URL Base Navigation in card header?

       

      Any information will be appreciated.

       

      Thanks,

      Wendy Chen

      Author's profile photo Makbule Merve Gul
      Makbule Merve Gul

      Hello All,

      I would be very appreciated if you can check it out my below post regarding OVP navigation issue that I am getting.

      https://stackoverflow.com/questions/65932256/cross-app-navigation-in-ovp-causes-the-column-disappear

      Best,

      Merve

      Author's profile photo Nakkina Yaswanth
      Nakkina Yaswanth

      Hi,

      I have a list card in OVP on click of it will navigate to one application, where this card having few navigation parameters passing to that application Now I want to manipulate and delete one of the  navigation parameter.

      Is there any way around to achieve it ?

      BR,
      Yashwanth