0 Replies Latest reply on Oct 23, 2010 6:33 AM by SiHoop

    MVC

    SiHoop Level 1

      I'm teaching myself mvc and would like someone to tell me if I'm on the right track. Below are my first 2 attempts. They both work but I want to get this right. I think the second approach is better than the first, but I'm not sure whether either approach is correct. The first approach adds content to an arrayCollection in the Model. The second approach adds content to the arrayCollection in the Controller. However, when I read about mvc in wikipedia I see that there is supposed to be a direct association from the controller to the view (which I do not have), but an indirect association from the view to the controller (but I think my association is direct as I have an instance of the controller created in the view).

       

      Please let me know if either approach is correct.

      Thank you!

       

      Approach 1

      <?xml version="1.0" encoding="utf-8"?>
      <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"  creationComplete="init()">
          <mx:Script>
              <![CDATA[
                  import mx.controls.List;
                  [Bindable] private var model:Model=new Model();
                  [Bindable] private var controller:Controller = new Controller();
                  private function init():void{
                      model = Model.createInstance();
                  }
                  private function clickHandler():void{
                      controller.addContent(textInput.text);
                  }
              ]]>
          </mx:Script>
          <mx:HBox>
              <mx:TextInput id="textInput" text="Add Data" />
              <mx:List dataProvider="{model.arrayCollection}" />
              <mx:Button label="Add" click="clickHandler()"/>       
          </mx:HBox>
      </mx:Application>

       

      package {
          import mx.collections.ArrayCollection;
          [Bindable]public class Model{
              public var arrayCollection:ArrayCollection = new ArrayCollection();
              private static var model:Model;
              public function Model(){
              }
              public static function createInstance():Model{
                  if(model == null){
                      model = new Model();
                  }
                  return model;
              }
              public function addElement(_content:String): void{
                  arrayCollection.addItem(_content);
              }
          }
      }

       

      package {
          import mx.controls.Alert;
          import mx.utils.StringUtil;
          public class Controller{
              private var model:Model;
              public function Controller(){
                  model = Model.createInstance();
              }
              public function addContent(_content:String):void{
                  var content:String=_content;
                  if(content==null || StringUtil.trim(content).length==0){
                      Alert.show("Try again", "Error", Alert.OK);
                  }
                  else{
                      model.addElement(content);
                  }
              }
          }
      }

       

      Approach 2

      <?xml version="1.0" encoding="utf-8"?>
      <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"  creationComplete="init()">
          <mx:Script>
              <![CDATA[
                  import mx.controls.List;
                  [Bindable] private var model:Model=new Model();
                  [Bindable] private var controller:Controller = new Controller();
                  private function init():void{
                      model = Model.createInstance();
                  }
                  private function clickHandler():void{
                      controller.addContent(textInput.text);
                  }
              ]]>
          </mx:Script>
          <mx:HBox>
              <mx:TextInput id="textInput" text="Add Data" />
              <mx:List dataProvider="{model.arrayCollection}" />
              <mx:Button label="Add" click="clickHandler()"/>       
          </mx:HBox>
      </mx:Application>

       

      package {
          import mx.collections.ArrayCollection;
          [Bindable]
          public class Model{
              public var arrayCollection:ArrayCollection = new ArrayCollection();
              private static var model:Model=new Model;
              public function Model(){
              }
              public static function createInstance():Model{
                  if(model == null){
                      model = new Model();
                  }
                  return model;
              }
          }
      }

       

      package {
          import mx.collections.ArrayCollection;
          import mx.controls.Alert;
          import mx.utils.StringUtil;

       

          public class Controller{
              private var model:Model=new Model;
              public function Controller(){
                  model = Model.createInstance();
              }
              public function addContent(_content:String):void{
                  var content:String=_content;
                  if(content==null || StringUtil.trim(content).length==0){
                      Alert.show("Try again", "Error", Alert.OK);
                  }
                  else{
                      model.arrayCollection.addItem(content);
                  }
              }
          }
      }