Navigation with data
Hi everyone,
While clicking on a button the page is navigating between the views but the data is not coming in the next view. I have written the following code in the views,
Home.view.js
---------------------------------------------------------------------------------
sap.ui.jsview("test.Home", {
/** Specifies the Controller belonging to this View.
* In the case that it is not implemented, or that "null" is returned, this View does not have a Controller.
* @memberOf test.Home
*/
getControllerName : function() {
return "test.Home";
},
/** Is initially called once after the Controller has been instantiated. It is the place where the UI is constructed.
* Since the Controller is given to this method, its event handlers can be attached right away.
* @memberOf test.Home
*/
createContent : function(oController) {
this.panel = new sap.ui.commons.Panel();
this.layout = new sap.ui.commons.layout.MatrixLayout();
this.txtfld = new sap.ui.commons.TextField({
id: "txtfield_id",
value: "{name}",
textAlign: sap.ui.core.TextAlign.Center,
tooltip: "Please Enter Your Name"
});
this.txtfld.bindProperty("value", "name");
// this.getView('Home').byId('txtfield_id').getText();
this.btn = new sap.ui.commons.Button({id: "btn_id" , text: "Hello"});
this.btn.setStyle(sap.ui.commons.ButtonStyle.Accept);
this.btn.attachPress(oController.Next);
this.layout.createRow(this.txtfld,this.btn);
this.panel.addContent(this.layout);
return this.panel;
}
});
Home.controller.js
-------------------------------------------------------------------------------------------------------------
sap.ui.controller("test.Home", {
/**
* 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 test.Home
*/
onInit: function() {
// var model = sap.ui.getCore().getModel("model");
// model.setData({
// "name" : sap.ui.getCore().byId("txtfield_id").getValue()
// });
var model = sap.ui.getCore().getModel("model");
sap.ui.getCore().byId("txtfield_id").setModel(model);
var context = new sap.ui.model.Context(model, "/0");
sap.ui.getCore().byId("txtfield_id").setBindingContext(context);
},
/**
* 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 test.Home
*/
// 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 test.Home
*/
// onAfterRendering: function() {
//
// },
/**
* Called when the Controller is destroyed. Use this one to free resources and finalize activities.
* @memberOf test.Home
*/
// onExit: function() {
//
// }
Next:function(){
var oEventBus = sap.ui.getCore().getEventBus();
// var model = sap.ui.getCore().getModel("model");
// model.setData({
// "name" : sap.ui.getCore().byId("txtfield_id").getValue()
// });
// publish event to trigger navigation to next page
oEventBus.publish("nav", "to", {
id : "Final"
});
}
});
Final.view.js
-------------------------------------------------------------------------------------------
sap.ui.jsview("test.Final", {
/** Specifies the Controller belonging to this View.
* In the case that it is not implemented, or that "null" is returned, this View does not have a Controller.
* @memberOf test.Final
*/
getControllerName : function() {
return "test.Final";
},
/** Is initially called once after the Controller has been instantiated. It is the place where the UI is constructed.
* Since the Controller is given to this method, its event handlers can be attached right away.
* @memberOf test.Final
*/
createContent : function(oController) {
this.panel1 = new sap.ui.commons.Panel();
this.layout1 = new sap.ui.commons.layout.MatrixLayout();
this.txtview = new sap.ui.commons.TextView("txtview_id");
this.txtview.bindProperty("text", "name");
this.btn1 = new sap.ui.commons.Button({id: "btn_id1" , text: "Back"});
this.btn1.setStyle(sap.ui.commons.ButtonStyle.Emph);
this.btn1.attachPress(oController.Back);
this.layout1.createRow(this.txtfld1,this.btn1);
this.panel1.addContent(this.layout1);
return this.panel1;
}
});
Final.controller.js
------------------------------------------------------------------------------------------------
sap.ui.controller("test.Final", {
/**
* 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 test.Final
*/
onInit: function() {
// var model = sap.ui.getCore().getModel("model");
// var model = sap.ui.getCore().getModel("model");
// sap.ui.getCore().byId('txtfield_id').setModel(model);
// var context = new sap.ui.model.Context(model, "/0");
// sap.ui.getCore().byId('txtfield_id').setBindingContext(context);
this.getView().byId('txtview_id').getText();
},
/**
* 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 test.Final
*/
// 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 test.Final
*/
// onAfterRendering: function() {
//
// },
/**
* Called when the Controller is destroyed. Use this one to free resources and finalize activities.
* @memberOf test.Final
*/
// onExit: function() {
//
// }
Back:function(){
var oEventBus = sap.ui.getCore().getEventBus();
// publish event to trigger navigation to previous page
oEventBus.publish("nav", "back");
}
});
Kindly check the code and let me know that where I had made the mistake for which the data is not navigating to the next view.
Thanks and regards,
Soumya