Expected Output
On clicking a row of the table details page should show the details of that row
Issue
Data binding not working.
In details view the controls are not showing the data bind to it.
In details view controller, if I print the context(which i am getting through getSelectedContext() on table)in console it is showing the data, but in view the controls are not showing the data
bind to it
index.html
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv='Content-Type' content='text/html;charset=UTF-8'/>
<script src="resources/sap-ui-core.js"
id="sap-ui-bootstrap"
data-sap-ui-libs="sap.m"
data-sap-ui-theme="sap_bluecrystal">
</script>
<!-- only load the mobile lib "sap.m" and the "sap_bluecrystal" theme -->
<script>
//set local resources
sap.ui.localResources("odatacruddemo");
//create app and set the initialPage to be displayed
var app = new sap.m.App({
initialPage: 'masterPage'
});
var masterPage = new sap.ui.view({
id: 'masterPage',
viewName: 'odatacruddemo.Master',
type: sap.ui.core.mvc.ViewType.JS
});
var detailsPage = new sap.ui.view({
id: 'detailsPage',
viewName: 'odatacruddemo.Details',
type: sap.ui.core.mvc.ViewType.JS
});
app.addPage(masterPage);
app.addPage(detailsPage);
app.placeAt('content');
</script>
</head>
<body class="sapUiBody" role="application">
<div id="content"></div>
</body>
</html>
Master.view.js
sap.ui.jsview("odatacruddemo.Master", {
/** 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 odatacruddemo.Master
*/
getControllerName : function() {
return "odatacruddemo.Master";
},
/** 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 odatacruddemo.Master
*/
createContent : function(oController) {
//add columns in a array to be added in table
var aProductTableColumns = [
new sap.m.Column({
header: new sap.m.Text({
text: 'Person ID'
})
}),
new sap.m.Column({
header: new sap.m.Text({
text: 'Name'
})
}),
new sap.m.Column({
header: new sap.m.Text({
text: 'EmployeeID'
})
}),
new sap.m.Column({
header: new sap.m.Text({
text: 'HireDate'
})
}),
new sap.m.Column({
header: new sap.m.Text({
text: 'Salary'
})
}),
new sap.m.Column({
header: new sap.m.Text({
text: 'Operations'
})
})
];
//add the data to the table using cells aggregation by using ColumnListItem
var oTableTemplate = new sap.m.ColumnListItem({
type: "Navigation",
press: [oController.onListPress, oController],
cells: [
new sap.m.ObjectIdentifier({
text: '{ID}'
}),
new sap.m.ObjectIdentifier({
text: '{Name}'
}),
new sap.m.ObjectIdentifier({
text: '{EmployeeID}'
}),
new sap.m.ObjectIdentifier({
text: '{HireDate}'
}),
new sap.m.ObjectIdentifier({
text: '{Salary}',
})
]
}).addStyleClass("sapUiResponsiveMargin");
//oTableTemplate.setType(sap.m.ListType.Active);
//create dialog for updating/editing data
var editPersonDetailsDialog = new sap.m.Dialog({
id: 'editPersonDetailsDialog',
title: 'Update Details'
});
//create table
var oProductTable = new sap.m.Table({
id: 'oProductTable',
columns: aProductTableColumns,
itemPress: [oController.onListPress,oController]
});
//oProductTable.setMode(sap.m.ListMode.SingleSelect);
oProductTable.setMode(sap.m.ListMode.SingleSelectMaster);
//bind the JSON data received from the service with Table
oProductTable.bindItems("/value",oTableTemplate);
var masterPage = new sap.m.Page({
title: "CRUD Operations on Public Odata Service",
content: [
oProductTable
]
});
return masterPage;
}
});
Master.Controller.js
sap.ui.controller("odatacruddemo.Master", {
/**
* 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 odatacruddemo.Master
*/
onInit: function() {
var serviceURL = 'http://services.odata.org/V4/OData/OData.svc/Persons?$expand=PersonDetail';
var oModel = new sap.ui.model.json.JSONModel(serviceURL);
oModel.attachRequestCompleted(function(oEvent){
//bind a model to a view
var masterView = sap.ui.getCore().byId("masterPage");
masterView.setModel(oModel);
//sap.ui.getCore().setModel(oModel);
});
//sap.ui.getCore().setModel(oModel);
},
/**
* 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 odatacruddemo.Master
*/
// 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 odatacruddemo.Master
*/
// onAfterRendering: function() {
//
// },
/**
* Called when the Controller is destroyed. Use this one to free resources and finalize activities.
* #memberOf odatacruddemo.Master
*/
// onExit: function() {
//
// }
onListPress: function(oEvent){
console.log('List Item pressed');
//Get the Selected Items
//get the row data which has been clicked
var clickedItem = sap.ui.getCore().byId('oProductTable').getSelectedItems();
var cells = clickedItem[0].getCells();
var contexts = sap.ui.getCore().byId("oProductTable").getSelectedContexts();
console.log('Master ctx:');
console.log(contexts);
var items = contexts.map(function(c) {
return c.getObject();
});
console.log(items[0]);
var detailsPage = app.getPage('detailsPage');
detailsPage.setBindingContext(contexts,"data");
app.to(detailsPage);
//var detailsView = sap.ui.getCore().byId("detailsPage");
//detailsView.getModel().setData(items[0]);
//var oContext = oEvent.getSource().getBindingContext();
//console.log(oEvent);
}
});
In above code I am setting the bindingContext to detailsPage and I am able to get that context in detailsPage but in the view it not showing the data.
Below is the DetailPage Code:
Details.view.js
sap.ui.jsview("odatacruddemo.Details", {
/** 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 odatacruddemo.Details
*/
getControllerName : function() {
return "odatacruddemo.Details";
},
/** 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 odatacruddemo.Details
*/
createContent : function(oController) {
var oObjectHeader = new sap.m.ObjectHeader({
title: "{Name}",
attributes:[
new sap.m.ObjectAttribute({
text: "{Name}"
})
]
});
var detailsPage = new sap.m.Page({
title: "DetailsPage",
content: [
oObjectHeader
]
});
return detailsPage;
}
});
Details.controller.js
sap.ui.controller("odatacruddemo.Details", {
/**
* 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 odatacruddemo.Details
*/
onInit: function() {
console.log('onInit() detailPage called');
},
/**
* 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 odatacruddemo.Details
*/
onBeforeRendering: function() {
var detailsPage = sap.ui.getCore().byId('detailsPage');
var context = detailsPage.getBindingContext("data");
console.log('ctx:=>');
console.log(context);
var items = context.map(function(c) {
return c.getObject();
});
console.log(items[0]);
},
/**
* 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 odatacruddemo.Details
*/
// onAfterRendering: function() {
//
// },
/**
* Called when the Controller is destroyed. Use this one to free resources and finalize activities.
* #memberOf odatacruddemo.Details
*/
// onExit: function() {
//
// }
});
In the details View the controls are not showing the data bind to it.
Please help ...
Thanks in Advance...
your tables and controls are not having any data binding at all. You have to bind the items aggregation of your table. When using JS Views take a look at this API https://sapui5.hana.ondemand.com/#/api/sap.m.ListBase/methods/bindItems of sap.m.Table.
First of all you should use XMLViews instead of JsViews.
For your binding problem take a look in the SAPUI5 developer. Take a look at this example from the developer guide and go through it.
https://sapui5.hana.ondemand.com/#/topic/97830de2d7314e93b5c1ee3878a17be9
sap.ui.controller("odatacruddemo.Details", {
onInit: function() {
console.log('onInit() detailPage called');
var oModel2 = new sap.ui.model.json.JSONModel();
var detailsPage = sap.ui.getCore().byId('detailsPage');
detailsPage.setModel(oModel2);
this.getView().addEventDelegate({
onBeforeShow : function(evt) {
var detailsPage = sap.ui.getCore().byId('detailsPage');
var context = detailsPage.getBindingContext("data");
console.log('ctx:=>');
console.log(context);
//sap.ui.getCore().getModel().setData(json);
var items = context.map(function(c) {
return c.getObject();
});
console.log(items[0]);
var dPage = sap.ui.getCore().byId('detailsPage');
dPage.getModel().setData(items[0]);
},
});
},
onNavPress: function(){
app.back();
}});
Related
I am trying to display a bar chart on click of Go button on selection screen.
I am getting invalid data binding in place of VIZ Chart.
I have attached the error message which I am getting. I have attached my XML view and its controller logic as well.
sap.ui.controller("znwpm_charts_dash.Charts", {
/**
* 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 znwpm_charts_dash.Charts
*/
onInit: function() {
var oVizFrame = this.getView().byId("idVizFrame");
jQuery.sap.require("sap.ui.model.resource.ResourceModel");
var oResourceModel = new sap.ui.model.resource.ResourceModel({
bundleName :"znwpm_charts_dash/i18n/i18n",
async :true
});
var oViewInternalModel = this.getView().getModel('viewInternalModel');
if(!oViewInternalModel){
oViewInternalModel = new sap.ui.model.json.JSONModel();
oViewInternalModel.setProperty("/filters", []);
this.getView().setModel(oViewInternalModel, 'viewInternalModel')};
sap.ui.getCore().setModel(oResourceModel , "i18n");
//
jQuery.sap.require("sap.ui.model.Filter" );
if(!oVizFrame){
}else{
oVizFrame.setVisible(false);
oVizFrame.setVizProperties({
title:{
text : "NWPM"
}
}); }
},
onSearch:function(evt){
this.aFilters = [];
var button = evt.getSource();
var eDock = sap.ui.core.Popup.Dock;
jQuery.sap.require("sap.m.MessageBox");
var startDate = this.getView().byId("startDateId").getValue();
if(!startDate){
sap.m.MessageToast.show("Start Date is required Field" ,{
duration:4000,
width :"25em",
my: eDock.CenterCenter,
at: eDock.CenterCenter,
of: window,
offset:"20"
}) ;
}else{
var endDate = this.getView().byId("endDateId").getValue();
if(!endDate){
sap.m.MessageToast.show("End Date is required Field" ,{
duration:4000,
width :"25em",
my: eDock.CenterCenter,
at: eDock.CenterCenter,
of: window,
offset:"20"
}) ;
}else{
this.__applyFilters();
};
};
},
__applyFilters:function(){
var oView = this.getView();
var filterModel = this.getView().getModel('viewInternalModel').getProperty("/filters");
this.__setDefaultFilters();
this.__oDataCall();
},
__setDefaultFilters:function(){
this._filterSetTemp('DateFrom', this.getView().byId("startDateId").getValue());
this._filterSetTemp('DateTo', this.getView().byId("endDateId").getValue());
},
_filterSetTemp:function(sPropertyName, oInputValue){
if(!this.aFilters){
this.aFilters = [];
var aFilters = [];
}
var oViewInternalModel = this.getView().getModel('viewInternalModel');
var aFilter = oViewInternalModel.getProperty("/filters");
aFilter[sPropertyName] = oInputValue;
oViewInternalModel.refresh();
this.aFilters.push( new sap.ui.model.Filter(sPropertyName, sap.ui.model.FilterOperator.EQ, oInputValue ) );
},
__oDataCall:function(){
var oVizFrame = this.getView().byId("idVizFrame");
var sUrl = "/sap/opu/odata/sap/ZIMM_INTERFACE_DASH_SRV";
var oDataModel = new sap.ui.model.odata.v2.ODataModel(sUrl ,true);
var oJsonModel = new sap.ui.model.json.JSONModel();
oItemsFilters = new sap.ui.model.Filter(this.aFilters, true);
var oView = this.getView();
oBusy = sap.ui.getCore().byId("busyID");
if(!oBusy){
var oBusy = new sap.m.BusyDialog("busyID",{
text :"Fetching Data"
});
}
oBusy.open();
oDataModel.read("/ChartsSet",{
filters:[oItemsFilters],
success:function(oData,response){
debugger;
oJsonModel.setData(oData);
oVizFrame.setModel(oJsonModel);
oVizFrame.setVisible(true);
oView.setModel(oJsonModel );
sap.ui.getCore().setModel(oJsonModel);
oBusy.close();
},
error:function(err){
oBusy.close();
}
});
},
selectData:function(evt){
debugger;
var onClick = evt.getParameters('data').data[0].data["Functional Area"];
var oApp = sap.ui.getCore().byId("idApp");
oApp.to("idTable");
},
/**
* 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 znwpm_charts_dash.Charts
*/
// 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 znwpm_charts_dash.Charts
*/
// onAfterRendering: function() {
//
// },
/**
* Called when the Controller is destroyed. Use this one to free resources and finalize activities.
* #memberOf znwpm_charts_dash.Charts
*/
// onExit: function() {
//
// }
});
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv='Content-Type' content='text/html;charset=UTF-8'/>
<script src="resources/sap-ui-core.js"
id="sap-ui-bootstrap"
data-sap-ui-libs="sap.m ,sap.viz"
data-sap-ui-xx-bindingSyntax="complex"
ata-sap-ui-preload="async"
data-sap-ui-theme="sap_bluecrystal">
</script>
<!-- only load the mobile lib "sap.m" and the "sap_bluecrystal" theme -->
<script>
sap.ui.localResources("znwpm_charts_dash");
var app = new sap.m.App("idApp",{initialPage:"idCharts1"});
var page = sap.ui.view({id:"idCharts1", viewName:"znwpm_charts_dash.Charts", type:sap.ui.core.mvc.ViewType.XML});
app.addPage(page);
var page2 = sap.ui.view({id:"idTable", viewName:"znwpm_charts_dash.Table", type:sap.ui.core.mvc.ViewType.XML});
app.addPage(page2);
app.placeAt("content");
</script>
</head>
<body class="sapUiBody" role="application">
<div id="content"></div>
</body>
</html>
I saw in the UI5 "Explored" examples a press event with what looks to be an array:
press="[handleViewSettingsDialogFilterBarPressed, views.control.tableViewSettingsDialog]"
Example on line 25
I understand how normal press events work. What does using an array like this do? I couldn't find documentation on it, so any info on how it works or a link to where it's documented would be very helpful.
It is a just a shortcut. Maybe it is easier to see this in an example here. Both handlers call the same function in the Controller.
sap.ui.jsview("myView.Template", {
getControllerName: function() {
return "myView.Template";
},
createContent: function(oController) {
var oBox = new sap.m.HBox({
items: [
new sap.m.Button({
text: 'First',
press: function(oEvent) {
oController.press(oEvent);
}
}),
new sap.m.Button({
text: 'Second',
press: [oController.press, oController]
})
]
});
return oBox;
}
});
sap.ui.define([
'jquery.sap.global',
'sap/ui/core/mvc/Controller',
], function(jQuery, Controller) {
"use strict";
var TableController = Controller.extend("myView.Template", {
press: function(oEvent) {
alert('press');
}
});
return TableController;
});
//Instantiate View
var view = sap.ui.view({
type: sap.ui.core.mvc.ViewType.JS,
viewName: "myView.Template"
});
view.placeAt("content");
the first item in the array is function to call and the second item is the binding object.
Thanks
Check out the description of the press Event property under the sap.m.Toolbar Constructor:
Events press : fnListenerFunction or [fnListenerFunction,
oListenerObject] or [oData, fnListenerFunction, oListenerObject]
I would like to display a messager in sapui5 Application, when onSave is printed or at the init function ist started. but i have always a error in the console and the messageToast do not work.
Errormessage in console:
Uncaught (in promise) TypeError: MessageToast.show is not a function
this is my controller.js:
sap.ui.define(['sap/ui/core/mvc/Controller',
'timeTrackertimeTracker/controller/BaseController',
'sap/ui/model/json/JSONModel',
"sap/m/MessageToast",
"sap/ui/model/odata/ODataModel",
"sap/ui/core/routing/History"
],
function(Controller, BaseController, MessageToast, JSONModel, ODataModel, History) {
"use strict";
//Global variables
//var _oController, oModel, oView;
var Calendarcontroller = BaseController.extend("timeTrackertimeTracker.controller.Calendarform", {
/* =========================================================== */
/* lifecycle methods */
/* =========================================================== */
onInit: function() {
//Store controller reference to global variable
this.getRouter().getRoute("Calendarform").attachPatternMatched(this._onRouteMatched, this);
MessageToast.show("init");
},
/* =========================================================== */
/* event handlers */
/* =========================================================== */
_onRouteMatched: function() {
// register for metadata loaded events
var oModel = this.getModel("appointments");
oModel.metadataLoaded().then(this._onMetadataLoaded.bind(this));
},
_onMetadataLoaded: function () {
// create default properties
var oProperties = {
Id: "Id" + parseInt(Math.random() * 1000000000)
/* duration: "",
resttime: "",
title: "",
starttime: "",
endtime: "",
Description: ""*/
};
// create new entry in the model
this._oContext = this.getModel("appointments").createEntry("/appointments", {
properties: oProperties
,
success: this._onCreateSuccess.bind(this)
});
// bind the view to the new entry
this.getView().setBindingContext(this._oContext, "appointments");
},
onSave: function(oEvent) {
// bind the view to the new entry
//this.getView().setBindingContext(this._oContext);
this.getModel("appointments").submitChanges();
},
_onCreateSuccess: function (oEvent) {
// navigate to the new product's object view
this.getRouter().navTo("AppointmentsList", true);
// unbind the view to not show this object again
this.getView().unbindObject();
// show success messge
/* var sMessage = this.getResourceBundle().getText("newObjectCreated", [ oEvent.Id ]);
MessageToast.show(sMessage, {
closeOnBrowserNavigation : false
});*/
},
/* _onCreateSuccess: function (oAppointment) {
// show success messge
var sMessage = this.getResourceBundle().getText("newObjectCreated", [ oAppointment.Title ]);
MessageToast.show(sMessage, {
closeOnBrowserNavigation : false
});
},
*/
onCancel: function() {
this.onNavBack();
//this.getView().getModel("appointments").deleteCreatedEntry(this._oContext);
},
/**
* Event handler for navigating back.
* It checks if there is a history entry. If yes, history.go(-1) will happen.
* If not, it will replace the current entry of the browser history with the worklist route.
* #public
*/
onNavBack : function() {
/* var oRouter = sap.ui.core.UIComponent.getRouterFor(this);
oRouter.navTo("AppointmentsList");*/
var oHistory = History.getInstance(),
sPreviousHash = oHistory.getPreviousHash();
// discard new product from model.
this.getModel("appointments").deleteCreatedEntry(this._oContext);
if (sPreviousHash !== undefined) {
// The history contains a previous entry
history.go(-1);
} else {
// Otherwise we go backwards with a forward history
var bReplace = true;
this.getRouter().navTo("AppointmentsList", {}, bReplace);
}
}
});
return Calendarcontroller;
});
Exchange places of parameters MessageToast and JSONModel in function (line 9): in the dependency list sap/ui/model/json/JSONModel mentioned before sap/m/MessageToast
I have implemented one table with JSONModel. Now I would like to add 2 buttons in toolbar for Sorting and filtering. How Can I achieve that? I have created the view in JS , so code help in JS is appreciated.
Please find below mentioned code for reference and please help me to implement sorting and filtering buttons.
sap.ui.jsview("com.sap.view.View1", {
/** 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 controller.View1
*/
getControllerName: function() {
return "com.sap.controller.View1";
},
/** 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 controller.View1
*/
createContent: function(oController) {
var oColumn1 = new sap.m.Column({
header: new sap.m.Label({text: "ID"})}
);
var oColumn2 = new sap.m.Column({
header: new sap.m.Label({text: "First Name"})}
);
var oColumn3 = new sap.m.Column({
header: new sap.m.Label({text: "Last Name"})}
);
var oColumn4 = new sap.m.Column({
header: new sap.m.Label({text: "Email"})}
);
var oColumn5 = new sap.m.Column({
header: new sap.m.Label({text: "City"})}
);
var oTable = new sap.m.Table("idTabel",{
headerToolbar: new sap.m.Toolbar({
content: [
/* new sap.m.Label({
text: "Sales Order List"
}), new sap.m.ToolbarSpacer({}),*/
new sap.m.Button("idPersonalizationButton", {
icon: "sap-icon://action-settings"
}),
new sap.m.Button("idFSG", {
icon: "sap-icon://filter"
})
]
}),
headerText: "Employee",
columns:[oColumn1,oColumn2,oColumn3,oColumn4,oColumn5],
mode: sap.m.ListMode.SingleSelectMaster,
selectionChange:[oController.onSelect, oController]
});
var oTemp = new sap.m.ColumnListItem({
cells: [new sap.m.Text({text: "{id}"}),
new sap.m.Text({text: "{first_name}"}),
new sap.m.Text({text: "{last_name}"}),
new sap.m.Text({text: "{email}"}),
new sap.m.Text({text: "{city}"})]
});
oTable.bindItems({
path: "/details",
template: oTemp
});
// oTable.setModel(oModel);
return new sap.m.Page({
title: "Simple Table",
content: [oTable
]
});
}
});
I had the same issue.
My conclusion:
If you want to use sap.m.Table the only way is to set the property useTablePersonalisation: "true"
Or you use sap.ui.Table which is easier to manipulate, but it's ugly and old.
viewtest is bound to a JSONModel. View2 is bound to the same JSONModel by creating a reference to viewtest and setting the model to viewtest.getModel().
What I'm trying to do is modify the shared model data in View3 by clicking a button so that the texts in textfield and textview will change automatically. However, the texts in textfield and textview remain "This is a text". What's the problem?
The index.html file:
and the viewtest.view.js file:
sap.ui.jsview("viewtest.viewtest", {
getControllerName : function() {
return "viewtest.viewtest";
},
createContent : function(oController) {
this.setModel(new sap.ui.model.json.JSONModel());
var oData = {
text: "this is a text"
};
this.getModel().setData(oData);
var oTextField = new sap.ui.commons.TextField({value: "{/text}"});
return [oTextField];
}
});
View2.view.js file:
sap.ui.jsview("viewtest.View2", {
getControllerName : function() {
return "viewtest.View2";
},
createContent : function(oController) {
var viewtest = sap.ui.view({viewName: "viewtest.viewtest", type:sap.ui.core.mvc.ViewType.JS});
this.setModel(viewtest.getModel());
this.getModel().setData(viewtest.getModel().getData());
var oTextView = new sap.ui.commons.TextView({text: "{/text}"});
return [oTextView];
}
});
View3.view.js file:
sap.ui.jsview("viewtest.View3", {
getControllerName : function() {
return "viewtest.View3";
},
createContent : function(oController) {
var oButton = new sap.ui.commons.Button({text:"click", press: func});
function func() {
var oView = new sap.ui.view({viewName:"viewtest.viewtest", type:sap.ui.core.mvc.ViewType.JS});
oView.getModel().setData({text:"hello world"}, true);
}
return [oButton];
}
});
Just a suggestion. Maybe it is worth to give in your .html file id to every view, and then in view3 update and set model to each one of the views by calling them by id?
Like,
in index.html:
var view1 = new sap.ui.view({id:"view1", viewName:"viewtest.View1", type:sap.ui.core.mvc.ViewType.JS});
and then in view3:
function func() {
var oView = sap.ui.getCore().byId("view1");
oView.getModel().setData({text:"hello world"}, true);
oView.getModel().refresh(); //if setting new model won't update the views
}
Or, if you use the same model in all your views, set model not to each view separately, but to the core:
viewtest.view.js file:
sap.ui.getCore().setModel(new sap.ui.model.json.JSONModel());
thus, you don't need to set model in view2.