DataField to custom DataGrid Itemrenderer

Similar Questions

• Defining a DataProvider to a custom in a DataGrid itemRenderer

  Hello

  I have a DataGrid with a column using a custom AS itemRenderer to display a ComboBox control.  Everything works, but there are various "odd" behaviors that occur (when I delete a line, the ComboBox control to the next line in the line resets to its label, but none of the others...)  When I add a line, seemingly random different comboboxes change their selectedItem, etc...)

  in any case, I had lucky isolate each of these individual bugs and their crushing, but whenever I do, others seem to pop up.  I suspect that the main problem is the way I put the dataProvider of the ComboBox.  The dataProvider is dynamic - an XML file generated from a table using PHP MySQL.  Knowing no other way to do it, I am of the substitution of the data method and setting it explicitly, as follows:

  override public function set data(value:Object):void {}

  Super.Data = value;

  dataProvider = value.uom;  value. GLU is the XML file

  }

  Is there a better way to set the data provider - an approach where I can put once and to avoid substitution entirely?  Yet once again, the itemRenderer is an ActionScript class and not implemented with XML...

  < mx:DataGridColumn itemRenderer = "converters. DataField UOMBox"="Glu"headerText ="GLU"/ >

  and...

  the package converters}

  SerializableAttribute public class UOMBox extends ComboBox {}

  ... etc...

  
  Thanks in advance.

  You can set the properties in the ClassFactory.  You can reference outerDocument or parentDocument if you hardwire where to look for it.

  Alex Harui

  Flex SDK Developer

  Adobe Systems Inc..

  Blog: http://blogs.adobe.com/aharui

• DataGrid ItemRenderer - image display

  I have a DataGrid and I want to display different images (PNG files) in a column based on the value for a given row.
  
  I have an object that looks like this:
  public class LogMsg {}
  public var type: String;
  public var msg:String;
  }
  
  My DataGrid uses a collection ArrayCollection of LogMsg of objects like his 'dataProvider '. I wish that the column "type" of my DataGrid to display an image instead of text ("error", "info", "debug").
  
  < mx:DataGrid >
  < mx:columns >
  < mx:DataGridColumn dataField = "type" headerText = "Type" itemRenderer = ""? "/ >"
  < mx:DataGridColumn dataField = "msg" headerText = "Message" / >
  < / mx:columns >
  < / mx:DataGrid >
  
  How would I go to do this? The structure of my application on disk looks like this:
  
  C:\my_app
  C:\my_app\assets
  C:\my_app\assets\error.PNG
  C:\my_app\assets\info.PNG
  C:\my_app\assets\debug.PNG
  C:\my_app\src\Main.mxml
  C:\my_app\src\view\MyDataGrid.mxml <-this is the one with the above data grid.
  
  Thanks in advance.

  Don't know if this is important:

  [Embed(source="assets/icons/info.png")]
  [Bindable]
  public static var IconInformation: Class;

• Change the list with Custom MXML itemRenderer DP problem

  Hello

  I have a list of spark with a custom MXML itemRenderer which has two States.

  One or the other is based on a property of data.isTrue, as follows:

  override protected function getCurrentRendererState (): String

  {

  If (Data.isTrue) {return 'TrueState' ;}

  Back to 'FalseState ';

  }

  When data.isTrue is set to true, the TrueState has the value that has a small arrow on the right side.

  When the dataProvider is replaced by a new collection, it restores all data correctly, except the image that is always visible when isTrue was true to the previous data set.

  To the overview, the arrow disappears.

  How can I fix this please?

  You may need to add a substitution of data layer that calls invalidateRendererState

• Flex MXML custom list ItemRenderer with States

  Hello

  I have a list custom MXML ItemRenderer which has two States, according to a property of the data object.

  I noticed that the data are defined when creating ended (creationComplete) and not in the intitialize step.

  Thus, in the creationComplete handler I follow these steps:

  If (Data.isTrue)

  {

  this.currentState = 'IsTrue';

  }

  on the other

  {

  this.currentState = 'NotTrue';

  }

  Is this the right place to put this?

  Thank you.

  If you are using 4.5, you want to substitute getCurrentRendererState

• DataGrid itemRenderer/itemEditor trouble

  I have a datagrid in a Flex project, the data grid is a XML as a source (see content below), now because of the way it is formatted (I can't change that) some of the data I want to display is inside a tag that is not at the level of the original table. Here is the file:

  <?xml version="1.0" encoding="utf-8" ?>
  <Categories>
   <Category>
    <CategoryName>Cat 1</CategoryName>
    <CategoryLink>http://www.google.com</CategoryLink>
    <CategoryData>
     <CategoryDescription>This is the description of category 1</CategoryDescription>
     <CategoryHeader>My Category Title 1</CategoryHeader>
     <CategoryNumber>1</CategoryNumber>
    </CategoryData>
   </Category>
  </Categories>
  

  I need to display CategoryData.CategoryDescription, CategoryData.CategoryNumber, CategoryLink and CategoryName.

  Now blindly, I abandoned the datagrid control in the project and he bound to the data source, I get the following returned for CategoryData:

  [object CategoryData_type]

  Not much use, but with what appears to be a hack I changed the column code read the dataField = "CategoryData.CategoryDescription" and Hooray it works. " I didn't know that at the time that it was bad, and when I passed an itemEditor things was wrong. When the datagrids load they display the correct data, but then when you try to change the child property fields you get the following error:

  ReferenceError: Error #1069: CategoryData.CategoryDescription property not found on valueObjects.Category_type and there is no default value.

  I looked towards the top of the error and I realize that this means that there is no value for CategoryData.CategoryDescription, but if I can display it why can I not change! What should I do to make this work?

  In any case, here's the code, it shows the default bound datagrid, a second datagrid with the applied hack, and a third hacked datagrid with itemRenderer and itemEditor on the number of columns

  Can you please take a look and tell me what I got wrong, more to the point, if there is a doc that explains how to deal with XML then this point please me home.

  I tried to change the return type for ONE of the columns, but it does not work, I also tried a labelFunction, but once again, I can get [object CategoryData_type] to display, but I get like the datagrid load null reference exception if I try to make the child accessories.

  Here is the Flex code:

  <?xml version="1.0" encoding="utf-8"?>
  <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
        xmlns:s="library://ns.adobe.com/flex/spark"
        xmlns:mx="library://ns.adobe.com/flex/mx"
        xmlns:categories="services.categories.*"
        minWidth="955" minHeight="600">
   <fx:Script>
    <![CDATA[
     import mx.controls.Alert;
     import mx.events.FlexEvent;
     
     protected function dataGrid_creationCompleteHandler(event:FlexEvent):void
     {
      getDataResult.token = categories.getData();
     }
     protected function lftest(item:Object, column:GridColumn):String
     {
      var t:String = item.CategoryData;
      return t;
     }
    ]]>
   </fx:Script>
   <fx:Declarations>
    <s:CallResponder id="getDataResult"/>
    <categories:Categories id="categories"
            fault="Alert.show(event.fault.faultString + '\n' + event.fault.faultDetail)"
            showBusyCursor="true"/>
    <!-- Place non-visual elements (e.g., services, value objects) here -->
   </fx:Declarations>
   <s:DataGrid id="dataGrid" x="10" y="10" width="684"
      creationComplete="dataGrid_creationCompleteHandler(event)" editable="true"
      requestedRowCount="4">
    <s:columns>
     <s:ArrayList>
      <s:GridColumn width="100" dataField="CategoryName" headerText="CategoryName"></s:GridColumn>
      <s:GridColumn width="100" dataField="CategoryLink" headerText="CategoryLink"></s:GridColumn>
      <s:GridColumn width="180" dataField="CategoryData" headerText="CategoryData"></s:GridColumn>
     </s:ArrayList>
    </s:columns>
    <s:typicalItem>
     <fx:Object CategoryData="CategoryData1" CategoryLink="CategoryLink1"
          CategoryName="CategoryName1"></fx:Object>
    </s:typicalItem>
    <s:AsyncListView list="{getDataResult.lastResult}"/>
   </s:DataGrid>
   <s:DataGrid id="dataGrid2" x="10" y="147" width="684" editable="true" requestedRowCount="4">
    <s:columns>
     <s:ArrayList>
      <s:GridColumn width="100" dataField="CategoryName" headerText="CategoryName"></s:GridColumn>
      <s:GridColumn width="100" dataField="CategoryLink" headerText="CategoryLink"></s:GridColumn>
      <s:GridColumn width="180" dataField="CategoryData" headerText="CategoryData"></s:GridColumn>
      <s:GridColumn dataField="CategoryData.CategoryDescription" headerText="Desc"></s:GridColumn>
      <s:GridColumn dataField="CategoryData.CategoryHeader" headerText="Head"></s:GridColumn>
      <s:GridColumn dataField="CategoryData.CategoryNumber" headerText="Num"></s:GridColumn>
     </s:ArrayList>
    </s:columns>
    <s:typicalItem>
     <fx:Object CategoryData="CategoryData1" CategoryLink="CategoryLink1"
          CategoryName="CategoryName1"></fx:Object>
    </s:typicalItem>
    <s:AsyncListView list="{getDataResult.lastResult}"/>
   </s:DataGrid>
   <s:DataGrid id="dataGrid3" x="10" y="284" width="684" editable="true" requestedRowCount="4">
    <s:columns>
     <s:ArrayList>
      <s:GridColumn width="100" dataField="CategoryName" headerText="CategoryName"></s:GridColumn>
      <s:GridColumn width="100" dataField="CategoryLink" headerText="CategoryLink"></s:GridColumn>
      <s:GridColumn width="180" dataField="CategoryData" headerText="CategoryData"></s:GridColumn>
      <s:GridColumn headerText="Number">
       <s:itemRenderer>
        <fx:Component>
         <s:GridItemRenderer>
          <s:NumericStepper value="{data.CategoryData.CategoryNumber}" />
         </s:GridItemRenderer>
        </fx:Component>
       </s:itemRenderer>
      </s:GridColumn>
      <s:GridColumn dataField="CategoryData.CategoryNumber" headerText="Number">
       <s:itemEditor>
        <fx:Component>
         <s:GridItemEditor>
          <s:NumericStepper value="{data.CategoryData.CategoryNumber}" />
         </s:GridItemEditor>
        </fx:Component>
       </s:itemEditor>
      </s:GridColumn>
     </s:ArrayList>
    </s:columns>
    <s:typicalItem>
     <fx:Object CategoryData="CategoryData1" CategoryLink="CategoryLink1"
          CategoryName="CategoryName1"></fx:Object>
    </s:typicalItem>
    <s:AsyncListView list="{getDataResult.lastResult}"/>
   </s:DataGrid>
  </s:Application>
  

  Any advice welcome.

  Shaine

  Another suggestion that I will try to a blog post from Hillel Coren

  http://hillelcoren.com/2008/09/21/Flex-Tip-convert-XML-to-ArrayCollection/

  
  
  
      
          Hello";
                  _data = convertXmlToArrayCollection( file );
              }
  
              private function convertXmlToArrayCollection( file:String ):ArrayCollection
              {
                  var xml:XMLDocument = new XMLDocument( file );
  
                  var decoder:SimpleXMLDecoder = new SimpleXMLDecoder();
                  var data:Object = decoder.decodeXML( xml );
                  var array:Array = ArrayUtil.toArray(data.rows.row);
  
                  return new ArrayCollection( array );
              }
  
          ]]>
      
  
      
  
  
  

• How to set a checkbox in a datagrid itemrenderer

  Hello.

  I have a spark datagrid. In a column, there is a checkbox. In another column (I need to add dynamically with actionscript), I have another check box (inside an itemrenderer). Cliccking on the first box, I need to toggle the second box.

  More generally, I have need to interact not only with a checkbox, but some other components inside the dynamically added columns.

  My question is: How do I get (with actionscript) components within a dynamically created itemrender?

  Follow the details related to the case of the box:

  Here my datagrid column definitions spark:

  <s:columns>
                      <s:ArrayList>
                                <s:GridColumn headerText="Azioni" resizable="false" sortable="false" width="49" ....../>
                                <s:GridColumn headerText="Iscritto" width="60" itemRenderer="renderers.EventoPersonaCheckBoxRenderer" dataField="iscritto"/>
                                <s:GridColumn id="personaEventoGridPersonaColumn" headerText="Persona" labelFunction...../>
                                <s:GridColumn id="personaEventoGridSocietaColumn" headerText="Societa" labelFunction..../>
                      </s:ArrayList>
            </s:columns>
  

  As you can see if there's an itemrender. A checkbox is inside.

  I must also add dynamically new columns in my datagrid. Each new column has an itemrender with a checkbox.

  Here the code to add a new column:

  private function createNewColumn():void
                                {
                                          var newColumn:GridColumn = new GridColumn("column TEST");
                                          newColumn.itemRenderer = new ClassFactory(NewColumnCheckBoxRenderer);
    
                                          var  cols:ArrayList = new ArrayList(); 
    
                                          cols =eventoPersonaGrid.columns as ArrayList;
                                          cols.addItem(newColumn);
                                }
  

  The itemrenderer is the following:

  <s:GridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
                                                    xmlns:s="library://ns.adobe.com/flex/spark" 
                                                    xmlns:mx="library://ns.adobe.com/flex/mx" clipAndEnableScrolling="true">
    
            <fx:Script>
                      <![CDATA[
                                import events.CheckBoxEvent;
    
                                protected function eventoSubscribedCB_clickHandler(event:MouseEvent):void
                                {
                                          data.iscritto = ! data.iscritto;
                                          dispatchEvent(new CheckBoxEvent(CheckBoxEvent.UPDATE,data.iscritto));
                                }
    
                      ]]>
            </fx:Script>
    
            <s:layout>
                      <s:HorizontalLayout horizontalAlign="center" verticalAlign="middle"/>
            </s:layout>
    
            <s:CheckBox id="eventoSubscribedCB" selected="{data.iscritto}" click="eventoSubscribedCB_clickHandler(event)"/>
    
  </s:GridItemRenderer>
  

  As explained above cliccking on the checkbox in datagrid definition, I need to change the properties of the check box that is located inside an itemrenderer.

  How can I do?

  Is there a way to get the itemrenderer and checkbox datagrid selectedItem property references?

  Thank you

  Pbesi

  In general, it is better to access the information contained in the data element or a shared object to determine the visuals for each rendering engine.  If you use the example Checkbox DataGrid spark of my blog, secondary renderers would be turn on or off depending on whether the data element is in the selectedItems.

  --

  Alex Harui

  Flex SDK Team

  Adobe System, Inc..

  http://blogs.Adobe.com/aharui

• DataGrid ItemRenderer with LinkButton.

  I have one of the columns in my DataGrid that needs to be a LinkButton. The actual data value is 0 or 1, but I want the LinkButton is visible only if the value is 1. The problem is that LinkButton is always visible. How can I selectively make visible or invisible on the various lines in the DataGrid? I tried to make the visible attribute associated with the value of the flag but without success.

  "< mx:DataGridColumn itemRenderer ="LinkButtonItemRenderer"dataField ="flag"/ >

  Here is the code LinkButtonItemRenderer.

  "< mx:LinkButton xmlns:mx ="http://www.adobe.com/2006/mxml"" visible = "{data.flag == 1}" label = "Click Me" / >

  Hi MoreGart,

  You can try this...

  http://www.Adobe.com/2006/mxml' render = "(Number (data.flag) == 1)? (Visible = true):(visible = false) "label ="Click Me"/ >

  Try this years made me know...

  Thank you

  Jean Claude

• DataGrid itemrenderer with the switch statement

  Hello

  I have the DataGrid with the columns

  < mx:DataGrid id = "dgvParagraphs" >
  < mx:columns >
  < mx:DataGridColumn dataField = "type" headerText = "Type" / >
  < mx:DataGridColumn dataField = "title" headerText = "Title" / >
  < mx:DataGridColumn dataField = "happy" visible = "false" / >
  < / mx:columns >
  < / mx:DataGrid >

  Under the type column I have values between 1 and 6. Each issue contains the content type. I have icons for each type. I want to show an icon instead of the right number. I know that this can be done using itemrenderes, but I do not know how to proceed.

  If this post answers your question or assistance, please mark it as such.

  Greg Lafrance
  www.ChikaraDev.com

  Support and Flex development services

  You might see problems with this code for scrolling, as DataGrid recycles itemRenderers, but in this case the information of the icon must be in the data.

  
  
    
      
    
    
      
        
          
            
              
            
          
        
        
        
      
    
    
      
        
          2
          
          Content 1
        
        
          5
          
          Content 2
        
        
          3
          
          Content 3
        
        
          1
          
          Content 4
        
        
          4
          
          Content 5
        
        
          6
          
          Content 6
        
        
          2
          
          Content 7
        
        
          1
          
          Content 8
        
        
          4
          
          Content 9
        
        
          5
          
          Content 10
        
        
          2
          
          Content 11
        
      
    
  
  

• Combobox and button inside datagrid ItemRenderer

  Hi all

  I'm moving the selectedItem of the comboxbox click event of a button. These two components are present within a datagrid control.

  A sample of cases looks like:

  Main.MXML

  < mx:DataGrid id = "dg1" dataProvider = "{initDG}" = "4" rowCount >
  < mx:columns >
  < mx:DataGridColumn dataField = "Artist" / >
  < mx:DataGridColumn dataField = "Album" / >

  < mx:DataGridColumn id = 'test' resizable = "true" headerText = "account Options".
  "itemRenderer ="components.comboButton "/ >
  < mx:DataGridColumn dataField = "acctOption" headerText = "account of Actions."
  < mx:itemRenderer >
  < mx:Component >
  < mx:LinkButton label = "Go" click = "parentDocument.testing ()" / >
  < / mx:Component >
  < / mx:itemRenderer >
  < / mx:DataGridColumn >
  < / mx:columns >
  < / mx:DataGrid >

  private var initDG:ArrayCollection = new ArrayCollection([)
  {Artist: 'Pavement', Album: 'Slanted and enchanted',}
  {Price: 11.99, State: 'AL'},
  {Artist: 'Pavement', Album: 'Brighten the corners',}
  {Price: 11.99, State: 'AL'}
  ]);

  And comboButton.mxml looks like:

  < mx:ComboBox id = "comboBox" >
  < mx:dataProvider >
  < mx:Array >
  < mx:Object label = "on" / >
  < mx:Object label = "two" / >
  < mx:Object label = "three" / >
  < mx:Object label = 'four' / >
  < mx:Object label = "5" / >
  < mx:Object label = "six" / >
  < / mx:Array >
  < / mx:dataProvider >
  < / mx:ComboBox >

  So, how can I display the value of the selectedItem, when user a chooses comboxbox values and click on the button 'Go '.

  I want to somehow show this value in my function called "testing().

  Please notify.

  Thank you

  Value editable = false on every DataGridColumn that you don't want an editor to appear

  Alex Harui

  Flex SDK Developer

  Adobe Systems Inc..

  Blog: http://blogs.adobe.com/aharui

• DataGrid itemrenderer &amp; evaluation of different column

  Hey all,.

  I played with this for a while, but can't do things.  Basically, I have an itemrenderer which has an image and a label, but I need to see what is the value of a different column before, I know what image to use.  I have a feeling that the reason why will not work my scheduled logic is because [the] data not reporesent not the structure of entire data... but I could be wrong.

  That's what I have now:

  The dataprovider on the grid is a collection of table I have a grid that refers to this itemrenderer:

  Form

  " < s:GridColumn dataField ="employee"headerText ="employee"

  " itemRenderer ="com.mycompany.view.assets.renderers.EmployeeStatusColour """> < / s:GridColumn >

  
  

  Element converter

  <? XML version = "1.0" encoding = "utf-8"? >

  < s:GridItemRenderer ' xmlns:fx = ' http://ns.Adobe.com/MXML/2009 "

  ... >

  < fx:Script >

  <! [CDATA]

  override public function prepare(hasBeenRecycled:Boolean):void {}

  THIS WORKS BUT NEED to ADD LOGIC

  lblData.text = data [column.dataField];

  statusImage.source = "com/mycompany/view/assets/images/dot_GREEN.png"

  //THIS IS what I WANT instead - SYNTAX below IS FAKE, BUT YOU WILL the IDEA

  lblData.text = data [column.dataField];
  

  If (Data [Column (3)] = {'MONDAY')

  statusImage.source = "com/mycompany/view/assets/images/dot_GREEN.png"

  } else {}

  statusImage.source = "com/mycompany/view/assets/images/dot_BLUE.png"

  }

  }

  []] >

  < / fx:Script >

  "" < s:HGroup verticalAlign = "middle" height ="100%" distance = "2">

  " < s:Image id ="statusImage """/ >

  " < s:Label id ="donneeslbl"paddingTop ="5"/ >

  < / s:HGroup >

  < / s:GridItemRenderer >

  Thanks in advance to anyone who can direct me to a solution.

  Flex

  Found the solution.  Well, I can go bang my head against the wall now!  Laughing out loud

  To find any value in the data structure you do the following:

  Data [Column.DataField = "dayStatus"];

• Using DataGrid Itemrenderer

  I created an ItemRenderer for datagrid control to set the background style when it is selected.

  When loading the data grid, I set the selectedItem/selectedIndex to 0, but the background style is not be reflected.

  All solutions?

  Concerning

  Mukund

  In theory, you would override updateDisplayList, call

  DataGrid (owner) .isItemSelected (data) and set the background on this basis.

  then it should work if you click or set selectedItem/selectedIndex.

• Obtaining value in DataGrid itemRenderer

  I have a DataGrid with CheckBox as ItemRendere in one column. My requirement is to retrieve all the rows in the DataGrid control that the boxes have been selected. I use the slider to achieve this. But I do not know how to retrieve the value of the check box selected in the cursor. During my application to debug cursor reads all the values of coumn in DataGrid except the CheckBox column.

  Can someone tell me please how to read the value of the checkbox. This is urget.

  There is an example on my blog where the checkbox updates all of the selectedItems.

  Alex Harui

  Flex SDK Developer

  Adobe Systems Inc..

  Blog: http://blogs.adobe.com/aharui

• DataGrid itemrenderer rowcount list do not change with the data

  I have a datagrid with an itemrenderer.  the itemrenderer is a list item.  I fill the list with different values for each row in the datagrid control.  It works very well.  However, I would like the list to reset the number of lines for each row in the datagrid control.  This is not the case.  If the first line datagrid list box is 3 rows of each list box in this column is 3 rows no matter what I do.  Here is my code:

  <mx:List xmlns:mx="http://www.adobe.com/2006/mxml" rowCount="1">
  <mx:Script>
    <![CDATA[
     import mx.utils.ObjectProxy;
     import mx.collections.ArrayCollection;
     import mx.utils.ArrayUtil;
    
     [Bindable] private var arr:Array;
       
     override public function set data( value:Object ) : void 
     {
      super.data = value; 
      if(value != null && value.MEET is ArrayCollection)
      {
       var len:Number = value.MEET.length;
       arr = new Array();
       for each (var obj:ObjectProxy in value.MEET){
        arr.push(obj.DAYS);
       }
       this.dataProvider = arr;
       //labelField = "DAYS";
       this.rowCount = len;
      }
      else if (value != null && value.MEET is ObjectProxy )
      {
       this.rowCount = 1;
       this.dataProvider = value.MEET;
       this.labelField = "DAYS";
       
      }
      else
      {
       this.rowCount = 1;
      } 
     }
     
    ]]>
  </mx:Script> 
  </mx:List>

  You have set variableRowHeight = true on the DataGrid control?

  Alex Harui

  Flex SDK Developer

  Adobe Systems Inc..

  Blog: http://blogs.adobe.com/aharui

• DataGrid itemrenderer causing data odd scrolling behavior

  I have a datagrid that is bound to a table for editing and display. I have a listener for the event, ItemEditEnd, that looks like the entrance, eats spaces and rewritten in the itemrenderer of the update string. But... If I can reload the data in the datagrid dataprovider makes correctly because he keeps a memory of the value previously edited and he appears again on the next line, where he was. Reloading so many times the data is edited values magically scroll down in the datagrid!
  
  I gues it's something to do with itemrenderers to be recycled, but I have no idea how the code around it. Any help would be welcome. A simplified model is attached to the top of the problem.
  
  Many thanks in advance,
  
  Steve

  I played for a while, but I'm not versed in the itemrenderer data thrown around yet. However, if you have not noticed, it is a fairly new article in the Adobe Flex development on itemEditors pole. Maybe something in that usage.