Datagrid et Itemrenderer dynamic

Version imprimable

19/07/2010, 12h35
bobkilla

Datagrid et Itemrenderer dynamic

Bonjour,

Je suis débutant en flex et je suis confronté à un problème un peu spécial et je ne trouve aucun exemple sur internet.

En fait j'ai un datagrid qui décrit un objet, j'ai dans une colonne le nom du champ et dans l'autre la valeur du champ. Sachant que ce champ peut être de différent type, il faudrait quand quand j'appuie sur un bouton Editer, le datagrid devienne editable seulement pour la deuxieme colonne (ça je l'ai deja fait) et que pour chaque type de valeur de champ, j'ai un textinput,checkbox,combobox ou datefield. En gros, un itemrenderer dynamique par rapport au type du champ.

Je suis arrivé à associer un itemrenderer dynamiquement lorsque je clique sur le bouton editer. Dans cet itemrenderer, j'ai les 4 types de champs différent mais caché. Le but est de rendre visible le bon type et de cacher les autres.
Pour l'instant, la valeur s'affiche bien dans la case lorsque je clique sur éditer, sauf que quand je clique dans la case pour editer, la valeur change en [object Object]

Je peux vous mettre un peu de code si vous voulez.

J'ai deja vu plusieurs exemple avec un itemrenderer spécifique par colonne, mais c'est plus compliqué dans mon cas...

Merci
19/07/2010, 13h41
ellene

Bonjour,

Citation:

Envoyé par bobkilla

Pour l'instant, la valeur s'affiche bien dans la case lorsque je clique sur éditer, sauf que quand je clique dans la case pour editer, la valeur change en [object Object]

Ne serait ce pas un problème dans la définition de ta méthode set data ?
Tu peux nous donner le code ton item renderer et nous montrer comment tu l'utilises dans ta datagrid s'il te plait ?

Code du datagrid :

Code:

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
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas
    xmlns:mx="http://www.adobe.com/2006/mxml"
    width="100%"
    height="100%"
    minHeight="100">
 
    <mx:Script>
        <![CDATA[
            import mx.events.DataGridEvent;
            import org.compagnie.projet.client.tools.identification.data.renderering.DynItemRenderer;
            /** Les données à afficher */
            [Bindable]
            private var _fields:Array;
 
            /** Le libellé des clés */
            [Bindable]
            private var _fieldLabel:String;
 
            /** Le libellé des valeurs */
            [Bindable]
            private var _fieldValue:String;
 
            public var result:Class;    
              [Bindable]         
            public var Img:ClassFactory;
 
            private var test1:DynItemRenderer;
 
            /**
             * Initialisation.
             * @param pFields Les données à afficher.
             * @param pFieldLabel Le libellé des clés.
             * @param pFieldValue Le libellé des valeurs.
             */
            public function initRendererForAutoTable(pFields:Array, pFieldLabel:String, pFieldValue:String):void {
                this._fields = pFields;
                this._fieldLabel = pFieldLabel;
                this._fieldValue = pFieldValue;
            }
 
            /**
             * Fixe les données à afficher.
             * @param pFields Les nouvelles données à afficher.
             */
            public function changeItemToRender(pFields:Array):void {
                this._fields = pFields;
            }
 
            public function set editable(editable:Boolean):void {
                this.ident_detail.editable = editable;
                if(editable) {
                    this.result = getDefinitionByName("org.compagnie.projet.client.tools.identification.data.renderering.DynItemRenderer") as Class;
                      this.Img = new ClassFactory(result);
                  }
                  else {
                      this.Img = null;
                  }
            }
 
            public function modifyEditedData(event:DataGridEvent):void {
                // Get the name of the column being editted.
                var colName:String = this.ident_detail.columns[event.columnIndex].dataField;
                if(colName=="key")
                {
                    // Handle the event here.
                    event.preventDefault();
                }
            }
        ]]>
    </mx:Script>
 
    <mx:DataGrid id="ident_detail" width="100%" height="100%" textAlign="center" variableRowHeight="true" wordWrap="true" dataProvider="{this._fields}" styleName="identData" itemEditBegin="modifyEditedData(event);">
        <mx:columns>
            <mx:DataGridColumn dataField="key" headerText="{this._fieldLabel}"/>
            <mx:DataGridColumn dataField="value" headerText="{this._fieldValue}" itemRenderer="{Img}"/>
        </mx:columns>
    </mx:DataGrid>
 
</mx:Canvas>

pour l'instant je gere que le textinput, voici le code de l'itemrenderer

Code:

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
<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml" horizontalAlign="center">
   <mx:Script>
        <![CDATA[
            import mx.events.FlexEvent;
            // Define a property for returning the new value to the cell.
            public var resultCheck:Boolean=false;
 
            // Override the set method for the data property.
            override public function set data(value:Object):void 
            {        
                if (value != null) 
                {
                    super.data = value;
                    valeur.text = oldData.value;
                }
            } 
        ]]>
    </mx:Script>
     <mx:Canvas width="100%">
          <mx:TextInput id="valeur" visible="true" width="100%" x="-2"/>
          <mx:ComboBox id="combo" width="100%" visible="false"  y="-2"/>
          <mx:CheckBox id="check" updateComplete="resultCheck=check.selected" visible="false" x="191"/>
          <mx:DateField id="date" y="-2" width="100%" x="0" visible="false"/>
     </mx:Canvas>
</mx:VBox>

Si je met super.data = value, quand je clique dans le textinput, ça me met [object Object]
Si je met super.data = value.value, ça s'affiche correctement, quand je clique dedans, c'est bon mais quand je sors, ça me dit un message du genre la value n'est pas défini.

05/08/2010, 21h35
Krazymins

Salut,

tu as taggué le sujet comme 'résolu'... tu aurais donc trouvé la solution ?
Peux-tu nous la partager stp, je suis sûr que cela pourra intéresser du monde :ccool: