on 01-31-2017 12:11 PM
Hi,
I'm just struggling to navigate between 2 veiws in SAPUI5. I see there are many threads available they are solved. But, for me even I follow the same step by step, I could not able to navigate from view1 to view2. Always getting below error.
extended_runnable_file.html] Control with ID app could not be found - EventProvider sap.ui.core.routing.Target - look at below code which am trying to do in Web IDE.
Can someone provide step by step document to do the same.
manifest.json
"routing": {
"config": {
"routerClass": "sap.m.routing.Router",
"viewPath": "firstApplication.view",
"controlId": "app",
"controlAggregation": "pages",
"transition": "fade"
},
"routes": [{
"name": "home",
"pattern": "",
"titleTarget": "",
"view": "View1",
"greedy": false
}, {
"name": "next",
"pattern": "next",
"titleTarget": "",
"view": "View2",
"greedy": false
}]
View1.controller.js
sap.ui.define([
"sap/ui/core/mvc/Controller"
], function(Controller) {
"use strict";
return Controller.extend("firstApplication.controller.View1", {
onPress: function() {
this.getOwnerComponent().getRouter().navTo("next");
}
});
});
We are using the following project structure
Name space : “com.demo.day3”
In manifest.json we define the following parameters –
Note we need rootView define, the id of the app in the rootview is considered controlID
"sap.ui5": {
"_version": "1.1.0",
"rootView": {
"viewName": "com.demo.day3.view.App",
"type": "XML"
},
"routing": {
"config": {
"routerClass":"sap.m.routing.Router",
"viewPath": "com.demo.day3.view",
"controlId": "app",
"controlAggregation": "pages"
},
"routes": [{
"name": "View1",
"pattern": "",
"target": ["View1"]
},{
"name": "View2",
"pattern": "toView2/{param1}",
"target": ["View2"]
}],
"targets": {
"View1": {
"viewType": "XML",
"transition": "slide",
"viewName": "View1",
"viewLevel": 0,
"controlAggregation": "pages"
},
"View2": {
"viewType": "XML",
"transition": "slide",
"viewName": "View2",
"viewLevel": 1,
"controlAggregation": "pages"
}
}
}
}
Another point to note is that the targets defined in the routes refer to the targets defined.
Initialize the routing in component as : this.getRouter().initialize();
thats it you should be good to go with routing,
if you wish to navigate between two views use the following code:
this.getOwnerComponent().getRouter().navTo("ROUTENAME");
//ROUTENAME = name defined for a route in manifest.json.
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
Hi CHENGALARAYULU ,
Actually your error seems that you are missing to provide App control with id = "app" in your App.view.xml (root view)
Just check your App.view.xml file similar code should be there :
<mvc:View xmlns="sap.m" xmlns:mvc="sap.ui.core.mvc" controllerName="firstApplication.controller.App" displayBlock="true" ><App id="app"/> </mvc:View>
thanks
Viplove
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
Thank you Viplove, I have already had this view, still was not able to perform navigation. but, above code worked for me.
User | Count |
---|---|
84 | |
23 | |
11 | |
9 | |
8 | |
5 | |
5 | |
5 | |
5 | |
4 |
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.