Skip to Content
0

Detail to Detailed page Navigation Issue in SplitApp

Feb 21, 2017 at 06:25 AM

165

avatar image

hi friends,

my application purpose is like below.

i have 1 master page and 2 detailed pages.

when i click on item in master then it will navigate to Detail page 1 .

when i click button on Detailed page 1 ,then Detailed Page 1 Should Navigate to DetailedPage 2.

from master to detail 1 navigation it was working fine,but when i try to navigation from Detail page 1 to Detailed page 2 ,,navTo("dtail2",oobj) is not working.

but when i refresh the URL at this Detailed Page2 manually ,then Detailed Page 2 is Displayed Correctly.

what might be the problem ?.

why detailed page 2 is displayed ,when i run manually,

why not navTo(<Detai2_route>,odat) is not working?

10 |10000 characters needed characters left characters exceeded
* Please Login or Register to Answer, Follow or Comment.

4 Answers

Best Answer
chandu balu Mar 04, 2017 at 12:34 PM
0

hi firends,

i got the solution after lots of struggling .

i forgo the "routerClass" :"sap.m.Rrouting.Router" at "config" under "routing" in manifest.json .

after placing this my application is working fine.

thank you guys for supporting me

Share
10 |10000 characters needed characters left characters exceeded
Akhilesh Upadhyay Feb 21, 2017 at 08:37 AM
0

any error you are getting ? check console and share that if any.

and share your routing configuration too

Share
10 |10000 characters needed characters left characters exceeded
chandu balu Feb 23, 2017 at 05:41 AM
0

yes i am getting the following Error Messages in Console.hear i attached the screen shorts of it

1.while Navigating between detail 1 to detail 2 page

2.while Refreshing the detail 2 page URL.

in the second case i.e refresh the URL of Detail page 2 i am getting o/p.

the error messages it seems both are same . i think its a navigation problem from Detail 1 to Detail 2 page. can you help me .

manifest.json
{
	"_version": "1.5.0",
	"sap.app": {
		"id": "sun.ui5.practiceapp3_project",
		"type": "application",
		"i18n": "i18n/i18n.properties",
		"applicationVersion": {
			"version": "1.0.0"
		},
		"title": "{{appTitle}}",
		"description": "{{appDescription}}",
		"sourceTemplate": {
			"id": "servicecatalog.connectivityComponent",
			"version": "0.0.0"
		},
		"dataSources": {
			"Northwind.svc": {
				"uri": "/northwind/V2/Northwind/Northwind.svc/",
				"type": "OData",
				"settings": {
					"odataVersion": "2.0",
					"localUri": "localService/metadata.xml"
				}
			}
		}
	},
	"sap.ui": {
		"technology": "UI5",
		"icons": {
			"icon": "",
			"favIcon": "",
			"phone": "",
			"phone@2": "",
			"tablet": "",
			"tablet@2": ""
		},
		"deviceTypes": {
			"desktop": true,
			"tablet": true,
			"phone": true
		},
		"supportedThemes": ["sap_hcb", "sap_belize"]
	},
	"sap.ui5": {
		"rootView": {
			"viewName": "sun.ui5.practiceapp3_project.view.splitApp",
			"type": "XML"
		},
		"dependencies": {
			"minUI5Version": "1.30.0",
			"libs": {
				"sap.ui.core": {},
				"sap.m": {},
				"sap.ui.layout": {},
				"sap.ushell": {},
				"sap.collaboration": {},
				"sap.ui.comp": {},
				"sap.uxap": {}
			}
		},
		"contentDensities": {
			"compact": true,
			"cozy": true
		},
		"models": {
			"i18n": {
				"type": "sap.ui.model.resource.ResourceModel",
				"settings": {
					"bundleName": "sun.ui5.practiceapp3_project.i18n.i18n"
				}
			},
			"": {
				"type": "sap.ui.model.odata.v2.ODataModel",
				"settings": {
					"defaultOperationMode": "Server",
					"defaultBindingMode": "OneTime",
					"defaultCountMode": "Request"
				},
				"dataSource": "Northwind.svc",
				"preload": true
			}
		},
		"resources": {
			"css": [{
				"uri": "css/style.css"
			}]
		},
		"routing": {
			"config": {
				"viewPath": "sun.ui5.practiceapp3_project.view"
			},
			"targets": {
				"Customers": {
					"viewType": "XML",
					"transition": "slide",
					"clearAggregation": true,
					"viewName": "mCustomers",
					"title": "Customers List For Master Page",
					"viewLevel": 1,
					"controlAggregation": "masterPages",
					"controlId": "idSplitApp"
				},
				"customer": {
					"viewType": "XML",
					"transition": "slide",
					"clearAggregation": true,
					"viewName": "dCustomer",
					"title": "Customer Details For Detailed Page",
					"viewLevel": 2,
					"controlAggregation": "detailPages",
					"controlId": "idSplitApp"
				},
				"Orders": {
					"viewType": "XML",
					"transition": "slide",
					"clearAggregation": true,
					"viewName": "dOrders",
					"title": "List Of Orders For Particular Customer",
					"viewLevel": 1,
					"controlId": "idSplitApp",
					"controlAggregation": "detailPages"
				}
			},
			"routes": [{
				"name": "Customers",
				"pattern": "",
				"titleTarget": "",
				"greedy": true,
				"target": ["Customers", "customer"]
			}, {
				"name": "customer",
				"pattern": "customer/{cID}",
				"titleTarget": "",
				"greedy": true,
				"target": ["customer", "Customers"]
			}, {
				"name": "Orders",
				"pattern": "orders/{cID}",
				"titleTarget": "",
				"greedy": true,
				"target": ["Orders", "Customers"]
			}]
		}
	}
}

Share
10 |10000 characters needed characters left characters exceeded
chandu balu Feb 23, 2017 at 06:16 AM
0

detail page 1 button press Controller code:

		onButtonPress: function(oobj) {
				var that = this;
				that.getOwnerComponent().getRouter().getRoute("customer").attachPatternMatched(function(oMathced) {
					// debugger;
				});
				var oselId = oobj.getSource().getText();
				var ord = {
					cID: oselId
				};
				// debugger;
				that.getOwnerComponent().getRouter().navTo("Orders", ord);
				// debugger;
			}

detail page 2 Controller Code:

sap.ui.define([
	"sap/ui/core/mvc/Controller",
	"sap/m/MessageToast",
	"sap/ui/table/Row"
], function(Controller, messageToast, tabRow) {
	"use strict";


	return Controller.extend("sun.ui5.practiceapp3_project.controller.dOrders", {


		/**
		 * Called when a controller is instantiated and its View controls (if available) are already created.
		 * Can be used to modify the View before it is displayed, to bind event handlers and do other one-time initialization.
		 * @memberOf sun.ui5.practiceapp3_project.view.dOrders
		 */
		onInit: function() {
			var that = this;
			that.getOwnerComponent().getRouter().getRoute("Orders").attachPatternMatched(function(oMathced) {
				var sel = oMathced.getParameter("arguments").cID;
				that.getView().getModel().read("/Customers('" + sel + "')" + "/Orders/", {
					success: function(oSelData) {
						var ojson = new sap.ui.model.json.JSONModel(oSelData);
						//ojson.SetData(oSelData);
						that.getView().byId("idTab").setModel(ojson);
								// that.getView().byId("idTab").bindAggregation("rows", {
						//that.getView().byId("idForm").bindElement("/results[0]/");
						// 	path: "/",
						// 	template: tabRow
						// });
						messageToast.show("Successfully Got the Orders From CustomerID:  " + sel);
					},
					error: function() {
						messageToast.show("Error While Reading Orders From CustomerID " + sel);
					}
				});


			});
		},
		tableCellClick: function(oeve) {
			var that = this;
			// debugger;
			var selval = oeve.getParameter("cellControl").getText();
			that.getView().getModel().read("/Orders(" + selval + ")", {
				success: function(odat) {
					// debugger;
					var json = new sap.ui.model.json.JSONModel(odat);
					that.getView().byId("idForm").setModel(json);
					that.getView().byId("idForm").bindElement("/");


					messageToast.show("FormData Readed Successfully");
				},
				error: function() {
					messageToast.show("Error While Reading The Form Data");
				}
			});
		}


		/**
		 * Similar to onAfterRendering, but this hook is invoked before the controller's View is re-rendered
		 * (NOT before the first rendering! onInit() is used for that one!).
		 * @memberOf sun.ui5.practiceapp3_project.view.dOrders
		 */
		//	onBeforeRendering: function() {
		//
		//	},


		/**
		 * Called when the View has been rendered (so its HTML is part of the document). Post-rendering manipulations of the HTML could be done here.
		 * This hook is the same one that SAPUI5 controls get after being rendered.
		 * @memberOf sun.ui5.practiceapp3_project.view.dOrders
		 */
		//	onAfterRendering: function() {
		//
		//	},


		/**
		 * Called when the Controller is destroyed. Use this one to free resources and finalize activities.
		 * @memberOf sun.ui5.practiceapp3_project.view.dOrders
		 */
		//	onExit: function() {
		//
		//	}


	});


});
Share
10 |10000 characters needed characters left characters exceeded