Skip to Content

Unable to fetch data from root view while navigating to target view

Hi All,

I am beginner to UI5.

I am using a remote odata file located on <https://sapes4.sapdevcenter.com/sap/opu/odata/IWBEP/GWSAMPLE_BASIC/$metadata>

for your reference i have attached the content of this file.

In my root view am getting data from ODATA as you can see in the snippet below.

Now i want to navigate to other view after clicking on any item,there i want to show the details of selected item.

But am not getting any details here.

Now what i used in my code-

In manifest.json

	"sap.app": {
		
		......
		
		"dataSources": {
			"ES4": {
				"uri": "/destinations/ES4/sap/opu/odata/IWBEP/GWSAMPLE_BASIC/",
				"type": "OData",
				"settings": {
					"odataVersion": "2.0"
				}
			}
		}
		},
		"sap.ui5": {
		.......
		
		"models" :
		{
				"" : {
			"dataSource": "ES4"
						}
		},
	
	
	"routing": {
	  "config": {
		"routerClass": "sap.m.routing.Router",
		"viewType": "XML",
		"viewPath": "opensap.hana.view",
		"controlId": "app1",
		"controlAggregation": "pages"
	  },
	  "routes": [
		{
		  "pattern": "",
		  "name": "app",
		  "target": "app"
		},
		{
		  "pattern": "detail/{ProductPath}",
		  "name": "detail",
		  "target": "detail"
		}
	  ],
	  "targets": {
		"app": {
		  "viewName": "App"
		},
		"detail": {
		  "viewName": "Detail"
		}
	  }
	}
	
	

In App.controller.js (my root view's controller)

sap.ui.define([
	.....
	], function(...........)
{
	"use strict";
	return Controller.extend("opensap.hana.controller.App",{
		........	
			onPress: function (oEvent) {
		
			var oItem = oEvent.getSource();		
			var oRouter = sap.ui.core.UIComponent.getRouterFor(this);
			oRouter.navTo("detail",{ProductPath: oItem.getBindingContext().getPath().substr(1)});
			
			  	}
			
			
		});
});

In Detail.view.xml

<mvc:View
controllerName="opensap.hana.controller.Detail"
	xmlns="sap.m"
	xmlns:mvc="sap.ui.core.mvc">
	<Page
		title="{i18n>detailPageTitle}">
	
	<ObjectHeader
			intro = "{Name}"
			title="{Product}"/>
	</Page>
</mvc:View>

In Detail.controller.js

sap.ui.define([
	"sap/ui/core/mvc/Controller"
], function (Controller) {
	"use strict";
	return Controller.extend("opensap.hana.controller.Detail", {
		onInit: function () {
			var oRouter = sap.ui.core.UIComponent.getRouterFor(this);
			oRouter.getRoute("detail").attachPatternMatched(this._onObjectMatched, this);
		},
		_onObjectMatched: function (oEvent) {
			//alert(oEvent.getParameter("arguments").ProductPath);
			this.getView().bindElement({
				path:"/"+ oEvent.getParameter("arguments").ProductPath,
				model: ""
				
			});
			}
	});
});

Thanks and Regards,

Ankit

capture1.jpg (51.2 kB)
capture1.jpg (51.2 kB)
capture.jpg (17.5 kB)
xmlodata.txt (43.8 kB)
Add comment
10|10000 characters needed characters exceeded

  • Get RSS Feed

3 Answers

  • Best Answer
    Dec 01, 2016 at 02:04 PM
    this.getView().bindElement({
    				path:"/"+ oEvent.getParameter("arguments").ProductPath,

    did u debug? what u get here?

    can you remove this ? model:""

    Add comment
    10|10000 characters needed characters exceeded

  • Dec 02, 2016 at 04:39 AM

    Hi Jun,

    Ya i debugged, and the path was as follows-

    <ProductSet('HT-9996')> , which is correct i guess(here 9996 is the item i clicked).

    I used empty model (i.e. "") for the simplicity, and it is working fine on the root view as you can see in first snippet.

    With Regards,

    Ankit

    Add comment
    10|10000 characters needed characters exceeded

    • just remove it, no need to mention model: "".

      this.getView().bindElement({
      				path:"/"+ oEvent.getParameter("arguments").ProductPath,
      				model:""});
  • Dec 02, 2016 at 05:38 AM

    Hi Jun,

    It worked.... saved a day.

    Thanks a lot..

    Can you elaborate how it worked??

    Because as far i know you have to mention model.

    With regards,

    Ankit

    Add comment
    10|10000 characters needed characters exceeded

    • Hi Ankit- No need to add model again.

      getView().bindElement({ Path : "/"+ MODEL DETAILS}) -> Here you get the information from prev view and in returns you will get the path details. As you have already bind Master model in component.js, so that It can refer to the master model to get the aggregated values as needed.

      for ex:

      //Master model

      [{

      "name" : "Ankit",

      "Address" : [{

      "Place" : "India"

      }]

      }]

      On click of name, you pass the Address as an ARGUMENT, in second page binding you can find /Address/0/Place

      Finally, you will get "India" in second view....