flex-issues mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From "Piotr Zarzycki (JIRA)" <j...@apache.org>
Subject [jira] [Updated] (FLEX-35227) [FlexJS] Data Binding Fails When Following Multiple References
Date Tue, 10 Jan 2017 06:49:58 GMT

     [ 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)

Mime
View raw message