Hi All,

I did all the configurations related to SAP FIORI My Inbox , every thing working as expected except Approve /Reject Buttons.

I have a work item which has decision boxes like Approve/Reject . As per the help document , I have completed Maintain Task Names and Decision Options , now I can see the Approve in Green , Reject in yellow  for selected work item  but When I click on Approve button nothing happens. The button seems to me there is no action triggering when I click on it.

Is there any configuration I am missing here other then the details provided from the below link? I have followed all the steps as per the link from SAP.

http://help.sap.com/fiori_bs2013/helpdata/en/41/fd595461fce630e10000000a44538d/content.htm

Thanks

Krishna

Hi Experts,

I was tried to include google maps in sapwebide to locate my current address. I was searched more thread about this. But no luck. Can you please any one help me how to achieve this option?

Regards,

Anup

Hi Experts,

we extended an  standard  (APPROVE PURCHASE ORDER )fiori application . now we are deploying into launchpad  .

NOW I HAVE DOUBT  .DO WE NEED TO APPLY WORKFLOW ( RELEASE STRATEGY)FOR EXTENDED APP

OR THE STANDARD ONE WILL WORK.

Thanks.

Sangamesh

I have created and built a custom theme for my fiori app(deployed on gateway server as BSP)  which works fine when executed from the URL by adding sap-theme parameter. But I want to use the original short URL for my Fiori App with the custom theme . Normally in index.html we give data-sap-ui-theme  but since here , I am not using index.html (using Component.js ) . 

If I use FLP parameter , it would change the theme for the whole launchpad which I don't want. I want this theme change to be app specific ie to my particular custom only. Is there any metadata property to be used inside Component.js for setting up theme id or any other way to achieve this.

Thanks

Amber

Hello All,

I am working on a newl created S4Hana system. and i am configuring some of the transactional apps with

Frontend components - UIS4HOP1 100

and Backend Component - SAP_BASIS 750

First I confirmed the required components are installed in the system

Next i activated the UI5 Service, Checked the Odata Service is working - by checking on the browser. Created the role for the fiori app. and gave the user the access.

Below in the table you can see the UI5 Services, Odata Services and the roles i am talking about. Ofcourse the App name which i am configuring.

Then the app is visible on the Launchpad. When i am clicking to open it, it is giving me an error, as below. Kindly share your expert comments to resolve this error.

I tried to debug the error, using the Google chrome debugger, I got 5 errors

2016-01-04 13:33:43 INTEROP service's ResolveLink operation returned 2 targets for hash '#ApplicationJob-show?JobCatalogEntryName=SAP_SCM_MRP', first one is used. - used target: {"id":"ApplicationJob-show~6Ik?JobCatalogEntryName=SAP_SCM_MRP","shellType":"FLP","postParameters":"JobCatalogEntryName=SAP_SCM_MRP","text":"Application Jobs","applicationData":"SAPUI5.Component=nw.core.appjobs","applicationAlias":"","applicationType":"URL","url":"/sap/bc/ui5_ui5/sap/nw_aps_apj","xappState":"","iappState":"","systemAlias":"","applicationDependencies":"{\"self\":{\"name\":\"nw.core.appjobs\",\"url\":\"/sap/bc/ui5_ui5/sap/nw_aps_apj/~03D547262FF423A7B836DE1A67E752A5~5\"},\"asyncHints\":{\"libs\":[{\"name\":\"sap.m\"},{\"name\":\"sap.me\"},{\"name\":\"sap.nw.core.applogs.lib.reuse\",\"url\":{\"url\":\"/sap/bc/ui5_ui5/sap/nw_aps_apl_lib/~686BEC20F9C8CC69BE07DEFBFAFBADE3~5\",\"final\":true}},{\"name\":\"sap.ui.core\"},{\"name\":\"sap.ui.commons\"},{\"name\":\"sap.ui.comp\"},{\"name\":\"sap.ui.table\"},{\"name\":\"sap.ushell\"}],\"components\":[{\"name\":\"sap.ca.scfld.md\"}]}}"}

ignored target: {"id":"ApplicationJob-show~62A?JobCatalogEntryName=SAP_SCM_MRP","shellType":"FLP","postParameters":"JobCatalogEntryName=SAP_SCM_MRP","text":"Application Jobs","applicationData":"SAPUI5.Component=nw.core.appjobs","applicationAlias":"","applicationType":"URL","url":"/sap/bc/ui5_ui5/sap/nw_aps_apj","xappState":"","iappState":"","systemAlias":"","applicationDependencies":"{\"self\":{\"name\":\"nw.core.appjobs\",\"url\":\"/sap/bc/ui5_ui5/sap/nw_aps_apj/~03D547262FF423A7B836DE1A67E752A5~5\"},\"asyncHints\":{\"libs\":[{\"name\":\"sap.m\"},{\"name\":\"sap.me\"},{\"name\":\"sap.nw.core.applogs.lib.reuse\",\"url\":{\"url\":\"/sap/bc/ui5_ui5/sap/nw_aps_apl_lib/~686BEC20F9C8CC69BE07DEFBFAFBADE3~5\",\"final\":true}},{\"name\":\"sap.ui.core\"},{\"name\":\"sap.ui.commons\"},{\"name\":\"sap.ui.comp\"},{\"name\":\"sap.ui.table\"},{\"name\":\"sap.ushell\"}],\"components\":[{\"name\":\"sap.ca.scfld.md\"}]}}"} sap.ushell_abap.adapters.abap.NavTargetResolutionAdapter

GET https://frcva9021aic.atisasg.com/sap/bc/ui5_ui5/sap/nw_aps_apl_lib/~686BEC20F9C8CC69BE07DEFBFAFBADE3~5/library-preload.json 403 (Forbidden)

2016-01-04 13:33:43 failed to preload 'sap.nw.core.applogs.lib.reuse.library-preload': Forbidden -  sap.ui.ModuleSystem

2016-01-04 13:33:48 Failed to load U5 component from #ApplicationJob-show?JobCatalogEntryName=SAP_SCM_MRP -  sap.ushell.renderers.fiori2.Shell.controller

2016-01-04 13:33:48 Could not open app. Try again later. - 

y @ core-min-0.js:85

error @ core-min-0.js:85

error @ core-min-1.js:16

(anonymous function) @ core-min-0.js:166

Can anyone please help me in resolving this.

Regards,

Shekhar

Three years ago I wrote a blog Six kinds of debugging tips to find the source code where the message is raisedin ABAP forum, trying to summarize my ABAP debugging experience by using a concrete example.

So far I have been working on Fiori development in SAP for 1.5 years. My belief as always is that a good developer should have the ability to resolve complex issue / bug by himself using debugging. Debugging can not also help to resolve issue but also enable developer to gain a better understanding on how UI5 framework runs. So I would like to try to summarize my JavaScript debugging skills and experience in this blog.

Chrome development tool

All the blogs mentioned here are written based on Chrome development tool. I can hardly imagine my life without it. It is so necessary to know and master how this tool can aid we Fiori developers to debug code swiftly and efficiently. I have listed all the tips how I leverage this tool in my daily work in this blog: Chrome Development Tool tips used in my daily work.

UI5 inspector

UI5 inspector in one of my favorite Chrome extension I use every day. See how to install it from this blog: An useful Chrome extension - UI5 Inspector.

Deal with "blank screen issue"

In Fiori world, you may frequently meet with "blank screen" issue after you click something in Fiori UI. For example, you click some UI field in application A to navigate to application B, however nothing is displayed, you can only see a blank screen. Most of the time it is because there is something wrong in JavaScript executing. When JavaScript error occurs, the page stops to render, so you see nothing.

Normally you could find corresponding JavaScript error displayed in console. The source code location of error reported in console mostly comes from the framework library, however according to my experience, 90% of the issues are not caused by framework, but by application side. The application code, either SAP standard or customer code, has generated some wrong output or perform incorrect operations which finally makes framework cease to work.

So the essential thing is to find out the exact line of SAP application code or your own enhancement which causes the trouble, so you can report incident to SAP application or fix your own code. There is an example in this blog My small experience about how to find the exact line position which causes "undefined is not a function" errorto demonstrate the trouble shooting tip.

See this blog How to quickly locate the code error in application which causes UI stop to loadfor another example.

UI5 field formatter

In Fiori UI the field formatter is widely used in XML view.

The frequently asked questions accordingly are:

• why my field formatter is not called at all?
• why I have specified formatter, and I can also see response is back from backend in Chrome development tool, why still finally I see empty UI field?

You can find answer to those questions as long as you understand how formatter works under the hood. You can read this blog Why my formatter does not work? A trouble shooting example to know how it worksto know more.

Even if you don't use any formatter, it is still useful if you understand the logic of data binding. See the explanation of data binding logic I learned via debugging from this blog How to trouble shoot field binding issue.

Negative cache

"Error: found in negative cache" - this error message found in console is always accompanied with the error dialog below.

If you know clearly about its meaning, you can then avoid it. See Something about negative cache error for detail.

Control registration and deregistration

Junior Fiori developers define control in XML view, bind control to a given model field. In the runtime the field displays value contained in model field correctly. That's all. They know nothing about why this data binding works as expected. They know nothing about the life-cycle management of control done by UI5 framework. As a result when tricky issues emerge, they don't know how to proceed. They may complain there is no documentation to discuss about this topic.

Now, you can research this stuff by yourself via debugging. See this blog How to monitor the control registration and deregistrationwhich contains my approach to study control life-cycle management by debugging framework code.

Another related blog: How to find the location where control id is created in the runtime.

How to dynamically change UI behavior via debugging

As a SAP developer, during my incident support life, usually I have to debug directly in customer system since the reported issue could not be reproduced in our internal system. Sometimes I find suspicious code which causes the issue, I would like to verify such as "If I chance the source code XXXX to code YYYY, the issue may be resolved". Of course I could not directly change UI code in customer system, however thanks to Chrome development tool, I can change the code loaded in Chrome development tool temporaily to finish my verification.

For example, I have a two DatePicker field with formatOptions set as style: long.

I need to change it to "style: medium" for verification purpose in the customer system. See this blog How to dynamically change the formatOption of control in the runtime via debugging for detail.

Fiori flower animation

As a Fiori developer or user you probably see this animation every day.

Have you ever thought about how it is implemented? You can read this blog Fiori Busy Dialog - when is it opened and closedto know how I find answer by debugging.

Fiori Icon logic

When I write the following code for the first time, I am curious about how the string "sap-icon://add" can finally be converted to a "+" icon in UI. If you have the same curiosity as me, see this blog Fiori Icon logic.

Find out the origin of suspicious HTTP roundtrips

This is a real question asked by one Australia customer by incident. Customer challenges SAP that why there are always three HTTP read roundtrips every time a given appointment is successfully saved.

And this blog why there are always multiple read operations after BATCH operation is done successfullycontains my reply to the customer

Date Picker

These blogs below are related to the UI5 control Date Picker. They are written after I have resolved some customer incidents with this control involved.

• Regarding Edm.DateTime in Fiori application
• More details of DatePicker
• DateFormat in DatePicker control
• Language related topic for DatePicker

Contact support button behavior

One day I was confused by the fact that I could see "Contact Support" in the error dialog in some system while in some other system the button is gone.

I cannot help figuring it out via debugging: Contact Support button display logic in Fiori.

Two types of popup Dialog in Fiori

The appearance of popup dialog normally is a sign to end user that something wrong occurs ( error popup dialog ) or some operation has been done ( info / success dialog ). A normal use case is to find out exactly in which line the popup dialog is raised. See this blog Two types of popup Dialog in Fiori.

Fiori globalization - amount display truncation logic

Have you even observed and asked yourself why 1880 USD in detail page is displayed as 2K USD in master list?

You are sure that it is framework which does this for you, but you don't know in which code the task is done. See this blog An example of Fiori Globalization implementation - the logic of amount value truncation to find answer.

An example of Fiori Globalization implementation - the number format mystery

Can you explain the reason of this display format difference?

If not, see this blog to find answer: An example of Fiori Globalization implementation - the number format mystery.

HTTP 200 OK and HTTP 304 Not Modified

This question is also asked by one of our customer. They have performance issue using Fiori solution and they are monitoring the resource loading performance in Chrome development tool and notice this behavior: for some resource, response is HTTP 200 while for others HTTP 304.

Although this blog Do you understand the logic of HTTP 200 OK and HTTP 304 Not Modifiedcontains mostly the debugging in ABAP backend, it still contains the tips to observe HTTP request and response in Chrome development tool, which is essential part to answer customer's doubt.

LAST BUT NOT THE LEAST - A Tutorial how I do self-study on a given Fiori control and UI5 framework code behind

Normally a Fiori application consists of various controls provided by UI5 library. If you just want to use a certain control and make it work in your application, it is enough for you to just go through the control API document, play it around in UI5 demokit. But if you meet with issues with the control, or you would like to know how the control is manipulated by UI5 framework to write a more robust and more efficient application, it is then inevitable that you need to dive into the UI5 framework source code.

Thus I write this tutorial, using the more simple button control for example, to illustrate how to thoroughly understand this control, together with the involved framework code in an step-by-step way.

Another benefit of studying UI5 framework code is, since the code are written by JavaScript veterans, by being familiar with those code everyday, you can learn how to program JavaScript in a more robust, elegant, generic, and efficient way, to upgrade your JavaScript skills.

The building blocks of this tutorial:

Part 1 UI5 module lazy load mechanism

Part 2 Control renderer

Part 3 Native html event VS UI5 semantic event

Part 4 control metadata

Part 5 control instance data

Part 6 control data binding

Part 7 Implementations for different binding mode: OneWay, TwoWay, OneTime

Part 8 Control ID

Part 9 Control internationalization support

Part 10 Button control in XML view

Part 11 Button control and its underlying DOM node

More to be added as long as I have resolved new incidents with debugging...

Hi All,

We are implementing SAP Fiori application "Look Up Retail Products" in our EHP7 Retail ECC system. We have activated the odata service and related SICF application. However there are some configuration steps which involve HANA Model configuration. We are not getting any clarification from the documentation (both from fiori app library as well as from APP documentation ) about the requirements for this application. Do we need to have HANA DB for this or we can use ANY DB.

App Implementation: Look Up Retail Products - SAP Fiori 1.0 for SAP ERP - SAP Library    

Regards,

Sarbjeet Singh

Problems:

1. Having HANA XS Engine. ( As Fiori Launchpad plugin not available need for custom Launchpad type app required)
2. Single entry point was not available for all user or all same role based apps (Landing Page for role based user)
3. Provide group of tiles on basis of user role.
4. Getting details of logged in user.
5. Session management was difficult (Options for Login and Logout).

Below is my way to Design Custom Launchpad and solve my problems.

Solution:

1. Designed UI like Launchpad using unified Shell and other components.
2. Managed user role on backend using custom table and on basis of user role group of tiles are available on custom Launchpad.
3. Most important session management done by CSRF token (Debugged HANA XS session and applied same).

UI Design for Custom Launchpad:

Steps to design Custom Launchpad like UI

• Index.html (same as standard one)

• Main View (Main.view.xml)
• View design using Unified Shell (sap.ui.unified.shell)

• Provide Home Icon, User Icon with Username, Logoff Icon, Center Text and Notification Icon (for centralized notification for user if required).
• Component.js page specify only root view.
• Without routing with only root view.

Application view with Shell only:

• For Routing use SAP Standard routing file :

1. MyRouting.js

(https://help.sap.com/saphelp_uiaddon10/helpdata/en/68/8f36bd758e4ce2b4e682eef4dc794e/content.htm?original_fqdn=help.sap.de)

• Specify routing in component.js and initiate routing

• Specify target control “idAppControl”.
• For simple application specify targetAggregation  “curtainContent” and hide master view .( hide curtainPaneContent)
• And for Split application use both curtainContent and curtainPaneContent. For Master Details targerAggregation will be curtainPaneContent and for Item details targetAggregation will be curtainContent.
• Specify tile group in Home.view.xml (on basis of user role tiles will be displayed)

• Getting list of tile by calling XSJS services on initialization of Home view.
• This view is not Master & Item view (not a split app) so hide master view.
• So view will be displayed in full page.
• setShowCurtainPane(false) used to hide master view.

• Page will be like

• Now when you click tile Leave App it will route to Leave app view as below
• Routing will be same as did for home page.

Session Management (Get Logged on User, Login and Logout):

• For Fiori Standard Login Page specify Authentication method in .XSaccess file in Launch pad package.

• So when you access Launchpad it will direct to Fiori Launch pad

• So when you specify correct credential it will direct to Custom Launchpad (or Landing Page).
• When we login at the time in backend unique CSRF token is generated and all session management is done using same CSRF token.
• Now getting logged in User details
• Using CSRF Token we can get logged in User details as shown below.

• When we call get username it will first get current CSRF token and using that CSRF token it is getting logged in user name. as shown in below Debugging :

• Get Username from calling getUSername and bind it with Custom Launchpad user section.
• In Custom Launchpad package .XSaccess authentication method is specified so in between if you try to access any view and if session is not started or session is destroyed it will direct to Fiori standard login page.
• Logout or terminate session :

• By pressing on logout icon from Launchpad it will call logout function.
• And logout function will get current CSRF Token and terminate session.
• As shown in below debugging :

• And again it will direct to Fiori standard login Page.

Getting group of Tiles on Basis User role:

• After getting name of user get role of user and on basis of that display group of tiles on Launchpad.
• In my case I created custom table and role based apps is specified.
• So at time of initialization I get group of tiles from custom tables using XSJS service and bind with tile container.
• And also give specific package privilege to user on depending their role.
• Like as shown in below.

• And if user do not have assigned privilege to Launchpad or try to direct access to not assigned app it will direct below page.

I hope this will helpful. :-)

Will update code on github soon.

Happy Coding .. :-) Have a nice day (y)

Regards,

Kalpan

There is need to Analyse Deployed apps on web (or published document public on web)

• So by Analyzing we can get to know from where deployed application is accessed.
• How much current users on deployed application.
• Or from which region user access application
• From which platform user access application (like Mobile, Desktop or tablet)
• Preferable browser for users (Like Chrome, Mozilla and IE)

Depending on results , we can make changes in application.

In market so many tools are available and Among them I used Google Analytic to  check how it works with Fiori applications.

Below are steps to implement it with HANA on demand trial account.

Fiori Application on HANA Cloud Platform (with HANA on Demand Trial Account)

Link: https://*******.dispatcher.hanatrial.ondemand.com/index.html

Go to Google Analytics: (http://www.google.com/analytics/)

Create new project add URL of application and get Tracking ID of URL

Get JavaScript code from Google Analytics and add it into index.html page of Fiori application.

Now can use all functionally of Analytics:

Live Status:

Region wise Status:

Traffic Source:

Also use all reports from Google analystics.

Happy coding

Hello,

is it possible to add external sources in a search connector ?

For example, I would like to grab data from an external system and to show result in the embedded search in the launchpad.

Thanks in advance,

Hello,

How can I add a table in an existing factsheet ?

This table will contain data from another oData service (for example related documents for document flow).

Thanks in advance,

We have implemented Fiori PR PO application in our organization.

There is an issue we face when we approve a PO and a message box comes up stating

"Approval or rejection of this purchase order is still in process. You can refresh the list of purchase orders manually."

hence we need to click the refresh button in the master page of the application.

Doing that successfully removes the concerned PO from the list and it gets approved successfully.

Hi guys,

I'm working in a project where we have setup Fiori and MyInbox. We have also enabled the Leave Request tile on the fiori side and the relevant services on the back end and I am now trying to configure the correct workflow to make the approval process for leave requests of type vacation work. I have tried to configure a copy of the workflow template WS12300111 as an approval workflow but that workflow seems to require some customisations to let the manager approve the leave request. I also tried with a copy of WS30000015 which seems to contain the required process, but when I configure this workflow in the processing process for leave type section in trx. SPRO I get an odd error on the Fiori side.

In the Gateway server in the Error log I get the error HRTIM_ABS_REQ022 which apparently means that the leave request could not be created on the back end. I have searched the net and OSS for meaningful explanations for this type of error and so far come up with nothing. Would any of you have any ideas? Should I be looking for a different workflow template?

Best regards,

Anders

Hi,

I have read that factsheets are going to die end of this year. I guess this will be maintained a few time but OVP will take the place in the end.

A lot of standard Fiori factsheets are already available and we could need this with small improvements.

Do you think it would be wiser to use directly specific OVP instead of trying to extend existing standard factsheets ?

Thanks in advance

Dear Fiori Experts,

I am trying to create a SimpleForm under my IconTabFilter2, As you already know, you can do that using SimpleForm. When type "form" and press Ctrl+Tab the code automatically fills it. I want to do the same for SimpleForm with Responsive Grid Layout. Is there any thing that I am missing regarding Auto-Code. I want to learn coding perfectly. Please do clarify my doubt. Suggest me Best Practices, So that I can practice and implement them.

Regards,

Raghu

Hi everyone!

I'm having problems with the descriptions of some WF tasks on the timeline of My Inbox app.

Instead to show the description corresponding the taks it's showed the following description: 'NOT_VALID'

It happens just in a few tasks. Anyone can help?

Thanks for all!

Hi experts,

I am using table select dialog(SAPUI5 Explored) to display some data, i want put a download button on this,How can i do it?

Thanks

Hello Reader,

My concern is with "My Travel Request" tile.

Am getting the HTTP error when ever I create a travel and click on submit button. Though for a moment the screen displays "Travel Request Submit" but I dont know if the travel request is being submitted.

Below is the screen shot of the error message am receiving: If You guys can help me in solving the error.

Regards,

Harriss

Please suggest me some material for trainings.

Category: Fiori Technology

This is a collaborative document to share lessons learned content for the SAP Fiori launchpad in the community SAP Fiori. The SAP Fiori launchpad - Portal and SAP Fiori launchpad - HCP documents are closely related to this space.

 

Please feel free to insert the link of your document or blog by selecting the edit button from Actions.  You can also search information and open a discussion if you can't find required information. Please don't forget to put the tag fiori.

 

SAP Fiori launchpad is the entry point to Fiori apps on mobile or desktop devices. The launchpad displays various tiles. Tiles are square or rectangular objects that provide access to applications. Which tiles are displayed on a user's entry page depends on the user's role. Depending on the role, the user can choose from a wide array of ready-to-use tiles from the tile catalog as part of the launchpad personalization.

 

URL:

launchpad:

https: //<host>.<domain>:<port>/sap/bc/ui5_ui5/ui2/ushell/shells/abap/Fiorilaunchpad.html?sap-client=<client>&sap-language=EN

launchpad designer:

https: //<host>.<domain>:<port>/sap/bc/ui5_ui5/sap/arsrvc_upb_admn/main.html?sap-client=<Client>?scope=CUST

Useful T codes:

Transaction: LPD_CUST - launchpad Customizing

Transaction: /UI2/SEMOBJ_SAP - Semantic objects delivered by SAP

Transaction: /UI2/SEMOBJ - Custom semantic objects

How to Guides: