Flex 3 Binding problem

Question

I have a custom ActionScript class:

package EntityClasses
{
import mx.collections.ArrayCollection;


[RemoteClass(alias="tkatva.tt.entities.CompanyInfo")]
[Bindable]
public class CompanyInfo
{
  public var companyInfoId:int;
  public var companyName:String;
     public var streetAddress:String;
     public var postNumber:String;
     public var city:String;
     public var country:String;
     public var email:String;
     public var businessIdentityCode:String;
     public var intBic:String;
     public var homepageUrl:String;
     public var lastUpdatedBy:String;
     public var lastUpdateDate:Date;
     public var version:int;
     public var settingGroupList:ArrayCollection;
     public var bankAccountList:ArrayCollection;
     public var personList:ArrayCollection;


}
}

And I want to bind these values to textBoxes, so that when user types information to the textBoxes it is populated in the class too. Is Flex 3 bidirectional so that marking the class with [Bindable] I can bind the values to a textbox for example?

This is my mxml file in which I try to bind the class:

    import mx.rpc.events.ResultEvent;
  import EntityClasses.CompanyInfo;

  [Bindable]
  public var company:CompanyInfo;



  public  var uuid:String;

  private function init():void {
   company = new CompanyInfo();
  }

  private function getCompanyInfo():void {
   try {
    company = TtRo.getCompanyInfo(uuid);

   } catch (Exception) {

   }
  }

  private function handleClick():void {
   this.txtInfo.text = "COMPANY:" + company.companyName;


    TtRo.addCompanyInfo(company,uuid);

  }

  private function handleAdding(e:ResultEvent):void {
   var res:Boolean;
   res = e.result as Boolean;
   if (res) {
    this.txtInfo.text = "OK";
   } else {
    this.txtInfo.text = "NOTOK";
   }
  }

 ]]>
</mx:Script>
<mx:TextInput x="194" y="10" id="txtCname" text="{company.companyName}"/>
<mx:TextInput x="194" y="40" id="txtStreet" text="{company.streetAddress}"/>
<mx:TextInput x="194" y="70" id="txtPostnumber" text="{company.postNumber}"/>
<mx:TextInput x="194" y="100" id="txtCity" text="{company.city}"/>
<mx:TextInput x="194" y="130" id="txtCountry" text="{company.country}"/>
<mx:TextInput x="194" y="160" id="txtEmail" text="{company.email}"/>
<mx:TextInput x="194" y="190" id="txtBic" text="{company.businessIdentityCode}"/>
<mx:TextInput x="194" y="220" id="txtIntBic" text="{company.intBic}"/>
<mx:TextInput x="194" y="250" id="txtUrl" text="{company.homepageUrl}"/>

Whats wrong with this? The flex compiler shows me this kind of warnings: Data binding will not be able to detect assignments to "company".

Im new to Flex and any help would be appriciated... Thanks...

Answer 1

You need to mark the variables themselves as bindable:

[Bindable]public var companyInfoId:int;

Welcome to Flex data binding, its lovely :)

Answer 2

No, Flex data binding is not bidirectional. You have to explicitly bind the text property of text fields back to the corresponding properties of the company object using BindingUtils.bindProperty()

private function init():void 
{
    company = new CompanyInfo();
    BindingUtils.bindProperty(company, "companyName", this ["txtCname", "text"]);
}

Answer 3

If you're using it in MXML components it might be more readable if you add the reverse binding in one place using the mx:Bindable tag

eg.

    <mx:Binding destination="company.companyName"   source="txtCname.text" />
    <mx:Binding destination="company.streetAddress" source="txtStreet.text" />
    ...
    etc.

Answer 4

Flex 3 Cookbook has a lot of recipes for this sort of work in chapter 11.9 & ch 14

Answer 5

Thank you all for your answers... Does anybody know class named ObjectProxy? I read somewhere from the internet that this could help...

Does anyone know it this binding is going to be better in Flex 4?