[
https://issues.apache.org/jira/browse/FLEX-35227?page=com.atlassian.jira.plugin.system.issuetabpanels:all-tabpanel
]
Piotr Zarzycki updated FLEX-35227:
----------------------------------
Attachment: POCSource_simple.zip
I did some investigation. Here is where I'm now. I did simplification of
Sankar's code. Some things is no needed in my opinion and binding should works.
Code:
*VO:*
{code:ActionScript}
public class ClassA
{
private var _fieldA:String = "Change Value..";
[Bindable]
public function get fieldA():String
{
return _fieldA;
}
public function set fieldA(value:String):void
{
_fieldA = value;
}
}
{code}
*View:*
{code}
<?xml version="1.0" encoding="utf-8"?>
<js:View xmlns:fx="http://ns.adobe.com/mxml/2009";
xmlns:js="library://ns.apache.org/flexjs/basic">
<fx:Script>
<![CDATA[
import org.apache.flex.events.Event;
private var _anyClass:ClassA = new ClassA();
protected function
onTextInputChangeA(event:org.apache.flex.events.Event):void
{
anyClass.fieldA = myTI1.text;
//dispatchEvent(new Event("valueChanged"));
}
//[Bindable("valueChanged")]
[Bindable]
public function get anyClass():ClassA
{
return _anyClass;
}
]]>
</fx:Script>
<js:beads>
<js:ViewDataBinding />
</js:beads>
<js:Container width="100%" height="100%"
style="margin-left:auto;margin-right:auto">
<js:beads>
<js:VerticalColumnLayout numColumns="2"/>
</js:beads>
<js:VContainer width="500">
<js:TextInput id="myTI1"
text="Change Value.."
change="onTextInputChangeA(event)"/>
<js:Spacer height="10"/>
<js:Label id="lbl" text="{anyClass.fieldA}" width="300"
className="simpleBold"/>
</js:VContainer>
</js:Container>
</js:View>
{code}
*After compilation _bindings array look like that:*
{code:JavaScript}
InitialView.prototype._bindings = [
1,
["anyClass", "fieldA"],
null,
["lbl", "text"],
0,
2,
"anyClass",
"valueChanged",
0,
null,
[
1,
2,
"fieldA",
"valueChange",
0,
null,
null,
null]];
{code}
ViewDataBinding checking the condition and decide that will create generic
binding - execute -> makeGenericBinding. Inside it's create PropertyWatcher
object who is registering on "valueChanged" events.
VO for fieldA has some default value. ("Change Value..")
- When we have first initialization of this ViewDataBinding function
"makeGenericBinding" do his job - Register PropertyWatcher. Inside this class
call: parentChanged (registration for "valueChanged") and update bindable
property by "updateProperty". - Init is OK.
- I'm changing something in my TextInput and "onTextInputChangeA" has been
called.
1) Binding is not working: getter "anyClass" is being fired, but no changes.
2) If I dispatch commented event "valueChanged" - PropertyWatcher class is
properly calling "changeHandler" function and Binding is working fine.
First questions:
- Should we have a BUG or maybe this is how it works in FlexJS ?
I will go farther with this, but I'm trying to think loudly to get some help on
this one. I will attach to jira changed example with pom file.
> [FlexJS] Data Binding Fails When Following Multiple References
> --------------------------------------------------------------
>
> Key: FLEX-35227
> URL: https://issues.apache.org/jira/browse/FLEX-35227
> Project: Apache Flex
> Issue Type: Bug
> Affects Versions: Apache FlexJS 0.8.0
> Reporter: Devsena
> Assignee: Piotr Zarzycki
> Attachments: POCSource.zip, POCSource_simple.zip
>
>
> Bracketed data binding to UI component do not works properly in FlexJS 0.8.0
> nightly build SDK (my tests were mainly concentrated to HTML output in
> browsers).
> *Works*
> {code}
> <js:Label id="lbl" text="{anyClass.fieldA}" width="300"/>
> {code}
> *Do not works*
> {code}
> <js:Label text="{anyClass.subClass.fieldB}" width="300"/>
> {code}
> Binding to UI component seems do not works when there are multiple reference,
> i.e. _class.field.field_. Following are the snippets of the codes which I
> used in this test:
> *InitialView MXML file*
> {code}
> [Bindable] private var anyClass:ClassA = new ClassA();
> protected function onTextInputChangeA(event:Event):void
> {
> anyClass.fieldA = myTI1.text;
> }
>
> protected function onTextInputChangeB(event:Event):void
> {
> anyClass.subClass.fieldB = myTI2.text;
> }
> ...
> <js:VContainer width="500">
> ...
> <js:TextInput id="myTI1" text="Change Value.."
> change="onTextInputChangeA(event)"/>
> <js:Label id="lbl" text="{anyClass.fieldA}" width="300"/>
> </js:VContainer>
> <js:VContainer width="500">
> ...
> <js:TextInput id="myTI2" text="Change Value.."
> change="onTextInputChangeB(event)"/>
> <js:Label text="{anyClass.subClass.fieldB}" width="300"/>
> </js:VContainer>
> {code}
> *ClassA*
> {code}
> public class ClassA extends EventDispatcher
> {
> [Bindable] public var subClass:ClassB = new ClassB();
>
> public function ClassA() { }
>
> private var _fieldA:String = "";
> [Bindable("fieldAChanged")]
> public function get fieldA():String
> {
> return _fieldA;
> }
>
> public function set fieldA(value:String):void
> {
> if (value != _fieldA)
> {
> _fieldA = value;
> dispatchEvent(new Event("fieldAChanged"));
> }
> }
> }
> {code}
> *ClassB*
> {code}
> [Bindable] public class ClassB extends EventDispatcher
> {
> public function ClassB()
> { }
>
> private var _fieldB:String;
>
> [Bindable(event="fieldBChanged")]
> public function get fieldB():String
> {
> return _fieldB;
> }
>
> public function set fieldB(value:String):void
> {
> if (value != _fieldB)
> {
> _fieldB= value;
> dispatchEvent(new Event("fieldBChanged"));
> }
> }
> }
> {code}
> I've attached herewith the source to the test project. Please, take a look.
--
This message was sent by Atlassian JIRA
(v6.3.4#6332)
