Skip to Content
0
Former Member
Jul 01, 2015 at 09:22 AM

How to change model data of a view from another view?

126 Views

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:

<script>
  sap.ui.localResources("viewtest");
  var view = sap.ui.view({viewName:"viewtest.viewtest", type:sap.ui.core.mvc.ViewType.JS});
  var view2 = sap.ui.view({viewName: "viewtest.View2", type: sap.ui.core.mvc.ViewType.JS});
  var view3 = sap.ui.view({viewName: "viewtest.View3", type: sap.ui.core.mvc.ViewType.JS});
  view.placeAt("content");
  view2.placeAt("content2");
  view3.placeAt("content3");
  </script>


  </head>
  <body class="sapUiBody" role="application">
  <div id="content"></div>
  <div id="content2"></div>
  <div id="content3"></div>
  </body>


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];
  }
});

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];
  }
});

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];
  }
});