Andy Goris

July 10, 2018 2 minute read

Update/Set Fiori application title with dynamic content

Hello and welcome to my first blog at SCN, I hope it will be useful to some of you.

As you know, Fiori applications are created to be simple so they are aimed to be used by normal end-users. However at the client I am currently working for, they want to use CATS (My Timesheet version 2) and give this application to a Time administrator who will fill in the timesheet of their assigned employees.

Next to a dozen of other required modifications, one of them is quite easy to achieve and will be the topic of this post: Updating the header title of the application with dynamic content.

The title is usually set in the manifest with a hardcoded value that links to a description in the i18n files as shown here:

The standard Fiori application for CATS has “My Timesheet” as title which is shown in the image below:

As the administrators won’t be filling in their time sheet but the one of the employee they selected in the previous screen, they want to have the employee’s name in the title.

After some searching on the web, a touch of OData extension, some trial and error and some praying, it was achieved in the following (quite easy) way:

Include the shell service in the manifest file

Update the title in an overwritten method of the view (method initializeView in my case)

		//Set employee info in title
		var oInfo = this.oConfiguration.getInitialInfoModel();
		if (oInfo.Pernr) {
			this.getOwnerComponent().getService("ShellUIService").then( // promise is returned
				function (oService) {					
					var sTitle = that.getView().getModel("i18n").getResourceBundle().getText("TIMESHEET_TITLE") + oInfo.EmployeeName;
					oService.setTitle(sTitle);
				},
				function (oError) {
					jQuery.sap.log.error("Cannot get ShellUIService", oError, "XXXXXXXXX.hr.MyTimesheet");
				}
			);
		}

The result is shown like this (along with the modification of the standard legend colors which was a different requirement):

Enjoy trying it out yourself and feel free to post questions in case of problems/doubts/…

7 Comments

You must be Logged on to comment or reply to a post.

Cristian Babei

July 10, 2018 at 1:48 pm

Thx Alot Andy!

Great Blog!

Matt D

July 12, 2018 at 4:39 am

Good work..!!

Tina Petry

February 11, 2020 at 1:01 pm

Dear Andy,

thanks very much for this example.

I tried to use it for my App (which extends a standard app), but unfortunatley I’m not able to add the service declaration at mainfest file.

I get this error at Web IDE error: Schema Error: Manifest json: “sap.ui5” – has addintional properties.

This is the code part from mainfest:

	"sap.ui5": {
		"_version": "1.1.0",
		
		"services": {
			"ShellUIService": {
				"factoryName": "sap.ushell.ui5service.ShellUIService"
			}
		},
		
		"dependencies": {
			"minUI5Version": "1.52.4"
		},
		"contentDensities": {
			"compact": true,
			"cozy": true
		},
		"models": {
			"@i18n": {
				"type": "sap.ui.model.resource.ResourceModel",
				"uri": "i18n/i18nExtension.properties"
			}
		},
		"extends": {
			"component": "fin.travel.mytravelexpensesv2",
			"extensions": {
				"sap.ui.controllerExtensions": {
					"fin.travel.mytravelexpensesv2.controller.ListPageExtension": {
						"controllerName": "myApp.controller.ListPageExtensionCustom"
					},
					"fin.travel.mytravelexpensesv2.controller.DetailPageExtension": {
						"controllerName": "myApp.controller.DetailPageExtensionCustom"
					}
				},
				"sap.ui.viewModifications": {
					"sap.fin.travel.lib.reuse.ListPage.view.ListPage": {
						"template::UserText": {
							"visible": false
						},
						"ExportButtonListPageID": {
							"visible": false
						}
					},
					"sap.fin.travel.lib.reuse.DetailPage.view.DetailPage": {
						"ExportButtonDetailPageID": {
							"visible": false
						}
					}
				}
			}
		}
	},

I search for this error and in some blogs they say that the version statement should be removed – but this dosen’t help.

Has anybody an idea what is wrong?

Andy Goris

June 11, 2020 at 1:09 pm

Sorry for my late reply, I'm using a different account now. Do you only get the error when you add the part of the service?

Chede Nag

February 17, 2020 at 6:55 pm

I followed the same steps as mentioned, but I am getting the below error.

The ServiceFactory sap.ushell.ui5service.ShellUIService for Service ShellUIService not found in ServiceFactoryRegistry!

Could any one help me in this.

Andy Goris

June 11, 2020 at 1:10 pm

How do you launch the application? From Fiori launchpad? Or using index.html?

Karsten Schaser

April 23, 2020 at 8:09 am

Thanks Any, works like a charm 🙂

Update/Set Fiori application title with dynamic content

Assigned Tags