Skip to Content
Mar 06, 2019 at 03:57 PM

SAPUI5 ObjectPageLayout routing and binding


Hi Everyone,

I'm trying the following :

on my View I choose a Extui Id, I want that when opening next View binding exists corresponding to the choosen installation.

Usually when I need to do that, I use routing such as :

"name": "View3",
"pattern": "/DonneesRelevesSet/View3/{G_CC},{G_SA},{G_Extui},{G_Anlage}",
"titleTarget": "",
"greedy": false,
"target": ["View3"]

Next step is to fill parameters when calling route :

		onPressModif: function (oEvent) {
			var oCC = oEvent.getSource().getCells()[0].getText();
			var oSA = oEvent.getSource().getCells()[8].getText();
			var oExtui = oEvent.getSource().getCells()[1].getText();
			var oAnlage = oEvent.getSource().getCells()[12].getText();
			oNavigation.navTo("View3", {
				G_CC: oCC,
				G_SA: oSA,
				G_Extui: oExtui,
				G_Anlage: oAnlage

Nothing extravagant.

with an usual view containing table of forms, it is easy to bind entity in onInit method but in my case, table is not recognized in controller :

onInit: function () {
			// Keeps reference to any of the created sap.m.ViewSettingsDialog-s in this sample
			this._mViewSettingsDialogs = {};
			var oRouter = sap.ui.core.UIComponent.getRouterFor(this);
			if (oRouter) {
				oRouter.getRoute("View3").attachMatched(this._onRouteFound, this);
				oNavigation = sap.ui.core.UIComponent.getRouterFor(this);
		_onRouteFound: function (oEvent) {
			var oArgument = oEvent.getParameter("arguments");
			var sCC = oArgument.G_CC;
			var sSA = oArgument.G_SA;
			var sExtui = oArgument.G_Extui;
			// alimentation données globales
			oPDL = sExtui;
			oSA = sSA;
			oInstallation = oArgument.G_Anlage;

it works with those items but not table. it is certainly due to the fact that my table is in a subsection of view2 :

				<m:Label text="Compte de contrat confirmé :"/>
				<m:Link text="Dummy" press="LinkCC" id="LienCC"/>
				<m:Label text="Secteur d'activité :"/>
				<m:Label text="Dummy" id="SecteurActivite"/>
			<ObjectPageSection title="Données du point de comptage" subSections="{DonneesPdlSet>/}">
					<ObjectPageSubSection title="Point de comptage">
							<Pdl:InfoPDCBlock id="InfoPDC" columnLayout="3"/>

corresponding subSections il like this :

<Table noDataText="Pas de données à afficher" id="table1" items="{DonneesPdlSet>/d/results}">
				<Title text="Infos PDL" level="H1"/>
				<Button tooltip="Trier les entrées" icon="sap-icon://sort" press="handleSortButtonPressed"/>
				<Button tooltip="Filtrer les entrées" icon="sap-icon://filter" press="handleFilterButtonPressed"/>
			<ColumnListItem type="Active" id="item0">
					<Link text="{DonneesPdlSet>ExtUi}" press="linkExtUi"/>
					<Link text="{DonneesPdlSet>Haus}" press="linkHaus"/>

			<Column id="column0">
					<Label text="PDL" id="label4"/>
			<Column id="column1">
					<Label text="Object de raccordement" id="label5"/>

How may I bind data dynamically to the subsection using selected Extui data ?

I tried this in afterRendering event :

			var oTable = this.byId("table1");
			if (oTable) {
				var oFilter1 = new sap.ui.model.Filter("Extui", FilterOperator.EQ, oPDL);
				var oFilter2 = new sap.ui.model.Filter("Sparte", FilterOperator.EQ, oSA);
				var filters = new sap.ui.model.Filter({
					and: true,
					filters: [
				var binding = oTable.getBinding("items");

No problem appears but it doesn't works. Output table is empty.

maybe using index instead of filters ? Json data are like this :

	"d": {
		"results": [{
			"ExtUi": "15478954685471",
			"Haus": "6000000007",
			"Vstelle": "5000000032",
			"Sparte": "Gaz",
			"Vertrag": "300000069",
			"Anlage": "4000000063",			
			"HouseNum1": "13",
			"Street": "rue des Rosiers",
			"PostCode1": "27520",
		}, {
			"ExtUi": "15478954685471",
			"Haus": "6000000007",
			"Vstelle": "5000000032",
			"Sparte": "Electricité",
			"Vertrag": "300000064",
			"Anlage": "4000000058",			
			"HouseNum1": "13",
			"Street": "rue des Rosiers",
			"PostCode1": "27520",
Thanks in advance.