title: How to change model data of a view from another view?
body: <p><strong>viewtest</strong> is bound to a JSONModel. <strong>View2</strong> is bound to the same JSONModel by creating a reference to <strong>viewtest</strong> and setting the model to viewtest.getModel().</p>
  
  <p>What I'm trying to do is modify the shared model data in <strong>View3</strong> 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?</p>
  
  <p>The index.html file:
  <img src="https://i.stack.imgur.com/cglYJ.png" alt="enter image description here"></p>
  
  <p>and the viewtest.view.js file:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="false" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>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];
   }
  });</code></pre>
  </div>
  </div>
  </p>
  
  <p>View2.view.js file:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="false" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>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];
   }
  });</code></pre>
  </div>
  </div>
  </p>
  
  <p>View3.view.js file:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="false" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>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];
   }
  });</code></pre>
  </div>
  </div>
  </p>