cancel
Turn on suggestions
Auto-suggest helps you quickly narrow down your search results by suggesting possible matches as you type.
Showing results for 
Search instead for 
Did you mean: 

Fiori Launchpad Custom Tile Controller.js Path Issue

Go to solution
Former Member

on ‎01-06-2017 9:40 PM

0 Kudos

Hello,

I made a custom tile that works fine when running the application locally. After deploying the application to our SAPUI5 ABAP repository and attempting to add the custom tile through our admin portal, the controller.js file is pointing to a cached location and throwing a 404 error. The tiles chip.xml file is registered and is obviously working because it gives me the option to select the tile type. The error I see in our launchpad looks like this:

Has anyone run into a similar issue where the controller.js file for a custom tile is attempting to load from a cached location instead of the appropriate repository?

I have tried several combinations to make the view.xml file point to the appropriate URL for the controller.js, but the launchpad continues to look for a cached copy. Please see the error highlighted below - any suggestions are appreciated:

The view.xml file is loading from the correct path:

The controller.js file should be loading from this path:

My folder structure looks like this:

Below is the coding for view.xml, controller.js, index.html, and chip.xml:

View.xml

<core:View xmlns="sap.m" xmlns:mc="sap.suite.ui.microchart" xmlns:core="sap.ui.core.mvc" controllerName="CustomTile.controller.CustomTile">
	<GenericTile header="My Team Status" subheader="Summary" size="M" frameType="OneByOne" press="onPress">
		<tileContent>
			<TileContent>
				<content>
					<mc:ComparisonMicroChart size="M" id="myChart">
						<mc:data>
							<mc:ComparisonMicroChartData title="P2 Incidents" value="3" color="Error"/>
							<mc:ComparisonMicroChartData title="Resolved Tickets" value="15" color="Good"/>
							<mc:ComparisonMicroChartData title="Open Tickets" value="75" color="Critical"/>
						</mc:data>
					</mc:ComparisonMicroChart>
				</content>
			</TileContent>
		</tileContent>
	</GenericTile>
</core:View>

Controller.js

sap.ui.define([
	"sap/ui/core/mvc/Controller"
], function(Controller) {
	"use strict";
	/*global jQuery, hasher */


	return Controller.extend("CustomTile.controller.CustomTile", {


			// trigger to show the configuration UI if the tile is pressed in Admin mode
			onPress: function() {
				var oView = this.getView(),
					oViewData = oView.getViewData(),
					oModel = oView.getModel(),
					sTargetUrl = oModel.getProperty("/nav/navigation_target_url"),
					oTileApi = oViewData.chip;
				if (oTileApi.configurationUi.isEnabled()) {
					oTileApi.configurationUi.display();
				} else if (sTargetUrl) {
					if (sTargetUrl[0] === "#") {
						hasher.setHash(sTargetUrl);
					} else {
						window.open(sTargetUrl, "_blank");
					}
				}
			}
	});
});

index.html

<!DOCTYPE HTML>
<html>


	<head>
		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
		<meta charset="UTF-8">


		<title>CustomTile</title>


		<script id="sap-ui-bootstrap"
			src="https://sapui5.hana.ondemand.com/sdk/resources/sap-ui-core.js"
			data-sap-ui-libs="sap.m"
			data-sap-ui-theme="sap_bluecrystal"
			data-sap-ui-compatVersion="edge"
			data-sap-ui-resourceroots='{"CustomTile": ""}'>
		</script>


		<link rel="stylesheet" type="text/css" href="css/style.css">


		<script>
			sap.ui.getCore().attachInit(function() {
				new sap.m.Shell({
					app: new sap.ui.core.ComponentContainer({
						height : "100%",
						name : "CustomTile"
					})
				}).placeAt("content");
			});
		</script>
	</head>


	<body class="sapUiBody" id="content">
	</body>


</html>

chip.xml

<?xml version="1.0" encoding="UTF-8"?>
<!-- Copyright (c) 2009-2014 SAP SE, All Rights Reserved -->
<chip xmlns="http://schemas.sap.com/sapui2/services/Chip/1">
	<implementation>
		<sapui5>
			<basePath>./</basePath>
			<viewName>view/CustomTile.view.xml</viewName>
		</sapui5>
	</implementation>
	<appearance>
		<title>My Tile</title>
		<description>Custom Tile</description>
	</appearance>
	<contracts>
		<consume id="configuration"/>
		<consume id="fullscreen"/>
		<consume id="navigation"/>
		<consume id="bag"/>
		<consume id="configurationUi"/>
		<consume id="preview"/>
		<consume id="refresh"/>
		<consume id="search"/>
		<consume id="url"/>
		<consume id="visible"/>
		<consume id="writeConfiguration"/>
	</contracts>
</chip>
Show replies
Show replies
Answer

Accepted Solutions (1)

Accepted Solutions (1)

Former Member
‎04-20-2017 9:04 PM

To answer the question - when deploying to the Fiori Launchpad you must remove the application name from the view and controller files. In my code on the original post you would replace the following:

Original View & Controller:
controllerName="CustomTile.controller.CustomTile"
Controller.extend("CustomTile.controller.CustomTile"

New View & Controller:
controllerName="controller.CustomTile"

Controller.extend("controller.CustomTile"

Show replies
Show replies

Answers (2)

Answers (2)

former_member590382
Discoverer
‎08-24-2018 4:49 PM
0 Kudos

I have this issue also. The current answers did not work for me. You were able to solve it?

Show replies
Show replies
Premnarayan
Product and Topic Expert
Product and Topic Expert
‎07-02-2018 12:18 PM
0 Kudos

Hi,

i am facing same issue but as you suggested here even after removing application name from the view and controller, it throws same error, could you help here in detail how did you resolved this?

Thanks, Prem

Show replies
Show replies
Ask a Question