Tuesday, December 21, 2010

Flex 3: two way binding with value objects

Today at work I was working with a VO and I didn't want to code an update function to update my VO every time there was a change. I feel like that extra function and calling updateVO all over the place looks sloppy.

What I ended up doing was inside my action script file I created a bindable instance of my VO.

[Bindable]
public var exampleVO:ExampleVO = new ExampleVO();


For the mxml file I ended up doing this.

<mx:binding source="txtFname.text" destination="exampleVO.fname">
<mx:binding source="txtLname.text" destination="exampleVO.lname">
<mx:Vbox>
<mx:Hbox>
<mx:label text="First Name:">
<mx:textinput id="txtFname" text="{exampleVO.fname}">
</mx:Hbox>
<mx:Hbox>
<mx:label text="Last Name:">
<mx:textinput id="txtLname" text="{exampleVO.lname}">
</mx:Hbox>
</mx:Vbox>

I had to be placed bindable tags at the top of page inside of the main tag. I set my bindings right after where I created my remote object.

That is how I did my two data bindings and I'm sure there are some other ways but this was the easiest for me and for what I was working on.

I did try to set the bindings with just AS3 using the BindingUtils.bindProperty() but I couldn't get it to work. I think my problem was that I didn't set it up to go both ways, so I might have to come back to that and try it.

No comments: