Discussion :

[karas.uchiwa]

Bonjour,

Après avoir chercher sur le forum j'ai trouver la solution pour faire du binding bidirectionnel dans un formulaire. Cependant cela ne fonctionne pas comme je le souhaiterai. En effet quand j'arrive sur le state

"object_edit_identifiant" la variable objectEdit a des valeurs affecter qui n'apparraissent pas dans les champs du formulaire.

J'ai imaginer que le formulaire a sa création était vide et que c'est le binding formulaire vide -> objectEdit qui se faisait en premier affichant un formulaire vide. Mais apparemment la variable objectEdit n'est pas modifier.

Quand je ne me pas les binding <mx:binding les valeurs de objectEdit s'affiche.

le code as3:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
 
        [Bindable]
        public var objectEdit:ObjectVO=new ObjectVO();
 
        public function goEdit():void
        {
        	objectEdit=objectSelected;
        	currentState='object_edit';
        }

le code mxml:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
 
		<mx:State name="object_edit_identifiant">
			<mx:AddChild position="lastChild">
				<mx:Form name="updateObjectForm" horizontalCenter="-21" verticalCenter="9" defaultButton="{objectCreate0}">
					<mx:FormHeading x="208" y="131" label="Edition d'objet" width="212" height="24" />
					<mx:FormItem label="Name">
						<mx:TextInput id="updateObjectName"	 text="{objectEdit.name}"  />
					</mx:FormItem>
					<mx:FormItem label="Label">
						<mx:TextInput id="updateObjectLabel" text="{objectEdit.label}" />						
					</mx:FormItem>
					<mx:FormItem>
						<mx:Button id="objectCreate0" label="Modifier" click="dispatchEvent(new Event(OBJECT_UPDATE_IDENTIFIANT,true))"/>
					</mx:FormItem>
				</mx:Form>
			</mx:AddChild>
			<mx:AddChild position="lastChild">
				<mx:Button x="10" y="36" label="Annuler" click="currentState='object_edit'"/>
			</mx:AddChild>
		</mx:State>

[samy2525]

Bonjour, est ce que c'est normal ça

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<mx:State name="object_edit_identifiant">

et ton currentState est juste ça

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

currentState='object_edit'

[karas.uchiwa]

Bonjour et merci de répondre par ce week-end,

Oui c'est normale car je fais

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
object->(goEdit)object_edit->object_edit_identifiant.

J'édite le formulaire qui pose problème : object_edit_identifiant qui concerne la variable objectEdit mais sans quand je passe par le state object_edit que la variable objectEdit est mise à jour.

Je rappelle que cela fonctionn correctement car quand je n'ai pas les <mx:binding les valeurs de textInput sont bien remplies.

[karas.uchiwa]

Dans ma recherche de la résolution du problème je fais le test suivant. Quand le binding #01 n'est pas présent le inputA met bien à jour le inputB mais inputB ne mets pas a jour inputA.

Je rajoute alors le binding #01 pour que cela fonctionne et cela ne fonctionne pas. Les inputs je mettent bien mutuellement à jour mais au démarrage ils n'ont pas la valeur initiale de la variable editA.

Je rappelle le but est de mettre à jour bidirectionnellement les deux inputs en passant par une variable intermédiaire pour pouvoir résoudre le problème originel.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
 
<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Script>
	<![CDATA[
		import mx.binding.utils.BindingUtils;
 
		[Bindable]
		protected var editA:String="Hello the world Initial";
 
	]]>
</mx:Script>
 
<!-- binding #01 --->
<mx:Binding source="inputB.text" destination="inputA.text" />
 
	<mx:TextInput x="222" y="59" width="337" id="inputA" text="{editA}" editable="true" enabled="true"/>
	<mx:TextInput x="222" y="89" width="337" id="inputB" text="{inputA.text}" editable="true" enabled="true"/>
	<mx:Button x="108" y="134" label="A"/>
	<mx:Button x="156" y="134" label="B"/>
	<mx:Button x="204" y="134" label="C"/>
	<mx:Button x="252" y="134" label="D"/>
</mx:WindowedApplication>

[karas.uchiwa]

Dans le précédent post je présentai un code simplifier qui ne représentait pas correctement mes problèmes rencontrés. Voici un nouveau code qui correspond mieux :

mxml:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
 
<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" currentState="A">
<mx:Script>
	<![CDATA[
		import mx.binding.utils.BindingUtils;
		import Test;
 
 
		[Bindable]
		protected var testA:Test=new Test();
 
		protected function addEditA():void
		{
			testA.value+="#A";
		}
 
	]]>
</mx:Script>
<mx:Binding source="inputA.text" destination="testA.value" />
<mx:Binding source="inputB.text" destination="testA.value" />
<mx:states>
	<mx:State name="A" >
	<mx:AddChild>
	<mx:TextInput x="222" y="59" width="337" id="inputA" text="{testA.value}" editable="true" enabled="true"/>
	</mx:AddChild>
	<mx:AddChild>
	<mx:Button x="108" y="134" label="A" click="addEditA()"/>
	</mx:AddChild>
	<mx:AddChild>
	<mx:Button x="156" y="134" label="B" click="currentState='B'"/>
	</mx:AddChild>
	<mx:AddChild>
	<mx:Button x="204" y="134" label="C"/>
	</mx:AddChild>
	<mx:AddChild>
	<mx:Button x="252" y="134" label="D"/>
	</mx:AddChild>
	</mx:State>
	<mx:State name="B">
	<mx:AddChild>
	<mx:TextInput x="222" y="89" width="337" id="inputB" text="{testA.value}" editable="true" enabled="true"/>
	</mx:AddChild>
	<mx:AddChild>
	<mx:Button x="156" y="134" label="B" click="currentState='A'"/>
	</mx:AddChild>
	</mx:State>
</mx:states>
</mx:WindowedApplication>

as3: Test.as

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
 
package
{
		[Bindable]
		public class Test
		{
			public var value:String;
 
			public function Test()
			{
				value="Hello the world ";
			}
 
		}
 
}

Les problèmes sont les suivants : au lancement les champs devrait être remplis car la variable testA.value est initialisée.

Quand sur le state A je rempli le champ de données et que je clique sur le bouton A, "#A" se rajoute bien à la fin du texte du champ du state A.
Cependant sur le stateB le champ reste désespérément vide.

Je rappel que l'énoncé de l'exercice est de passé par la variable intermédaire car elle est utilisé pour communiqué avec de l'as3 ailleurs dans le code grâce justement au binding.

Merci.

[samy2525]

Bonjour, à ta place j'aurai fais ça

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
<mx:TextInput x="222" y="59" width="337" id="inputA" text="{getValue(test)}" editable="true" enabled="true"/>

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

private function getValue(test : Test):String{return test.value}

et j'aurai enlever le binding sur la class Test

voila j'espere que ca va t'aider

Bon courage

[karas.uchiwa]

Bonjour,

Merci de m'aider samy2525 mais t'as solution si je l'ai correctement implémenté ne fonctionne pas.

J'ai quand même trouvé une solution de contournement. Je poste ma solution à mon dernier exemple simplifier en espérant que cela serve à quelqu'un.

as3: Test.as3

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
 
package
{
 
		[Bindable]
		public class Test
		{
 
			public var value:String;
 
			public function Test()
			{
				init();
			}
 
			public function init():void
			{
				value="Hello the world ";
			}
 
		}
 
}

mxml:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
 
<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" currentState="A" creationComplete="init()" exitFrame="quit()">
<mx:Script>
	<![CDATA[
		import mx.binding.utils.BindingUtils;
		import Test;
 
		[Bindable]
		protected var testA:Test=new Test();
 
		protected function init():void
		{
		  BindingUtils.bindProperty(inputA, "text", testA, "value");
          BindingUtils.bindProperty(inputB, "text", testA, "value");
          BindingUtils.bindProperty(testA, "value", inputA, "text");
          BindingUtils.bindProperty(testA, "value", inputB, "text");
 
          // debugage    
          trace("a : "+testA.value);
		}
 
		protected function quit():void
		{
          // debugage    
		  trace("b : "+testA.value);				
		}
 
		protected function addEditA():void
		{
			testA.value+="#A";
		}
 
	]]>
</mx:Script>
<mx:states>
	<mx:State name="A" >
	<mx:AddChild creationPolicy="all">
	<mx:TextInput x="222" y="59" width="337" id="inputA" editable="true" enabled="true"/>
	</mx:AddChild>
	<mx:AddChild creationPolicy="all">
	<mx:Button x="108" y="134" label="A" click="addEditA()"/>
	</mx:AddChild>
	<mx:AddChild creationPolicy="all">
	<mx:Button x="156" y="134" label="B" click="currentState='B'"/>
	</mx:AddChild>
	<mx:AddChild creationPolicy="all">
	<mx:Button x="204" y="134" label="C"/>
	</mx:AddChild>
	<mx:AddChild creationPolicy="all">
	<mx:Button x="252" y="134" label="D"/>
	</mx:AddChild>
	</mx:State>
	<mx:State name="B">
	<mx:AddChild creationPolicy="all">
	<mx:TextInput x="222" y="89" width="337" id="inputB" editable="true" enabled="true"/>
	</mx:AddChild>
	<mx:AddChild creationPolicy="all">
	<mx:Button x="156" y="134" label="B" click="currentState='A'"/>
	</mx:AddChild>
	</mx:State>
</mx:states>
</mx:WindowedApplication>

Merci.