Skip navigation
Currently Being Moderated

ComboBox in a Spark DataGrid

Jul 5, 2011 7:46 AM

Hello,

 

Is there any difference between setting the data provider of a combo box in the MXML, and setting it from an actionscript code?

 

In the example below I create a table. The first column has combo editor with data provider set in the mxml. For the second I listen for a grid item editor session start event and then set the data provider. I expect that both columns should behave the same, but if I click on item from the second column, then it's not selected in the list and moreover is cleared when I click another cell. Could you please help? What could be the problem?

 

<?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" 
                            xmlns:s="library://ns.adobe.com/flex/spark" 
                            xmlns:mx="library://ns.adobe.com/flex/mx" 
                            creationComplete="creationCompleteHandler(event)">
     
     <fx:Script>
          <![CDATA[               
               import mx.controls.ComboBox;
               import mx.events.FlexEvent;
               
               import spark.components.gridClasses.ComboBoxGridItemEditor;
               import spark.events.GridItemEditorEvent;

               protected function creationCompleteHandler(event:FlexEvent):void
               {
                    grid.dataProvider = new ArrayList([
                         {column1:'red',column2:'red',column3:'red'},
                         {column1:'red',column2:'red',column3:'red'},
                         {column1:'red',column2:'red',column3:'red'}]);
                    
                    grid.addEventListener(GridItemEditorEvent.GRID_ITEM_EDITOR_SESSION_START, prepareCellEditor);
               }
               
               protected function prepareCellEditor(event:GridItemEditorEvent):void
               {
                    if (event.column.dataField == 'column2') {                         
                         var comboEditor : ComboBoxGridItemEditor = event.currentTarget.itemEditorInstance as ComboBoxGridItemEditor;
                         comboEditor.dataProvider = new ArrayList(['red','green','blue']);               
                    }

               }
          ]]>
     </fx:Script>
     
     <s:DataGrid id="grid" editable="true" width="100%" height="100%">          
          <s:columns>
               <s:ArrayList>
                    <s:GridColumn dataField="column1" headerText="Column 1">
                         <s:itemEditor> 
                              <fx:Component> 
                                   <s:ComboBoxGridItemEditor> 
                                        <s:dataProvider>
                                             <s:ArrayList>
                                                  <fx:String>red</fx:String>
                                                  <fx:String>green</fx:String>
                                                  <fx:String>blue</fx:String>
                                             </s:ArrayList>
                                        </s:dataProvider>
                                   </s:ComboBoxGridItemEditor> 
                              </fx:Component> 
                         </s:itemEditor>
                    </s:GridColumn>
                    <s:GridColumn dataField="column2" headerText="Column 2" itemEditor="spark.components.gridClasses.ComboBoxGridItemEditor"/>
                    <s:GridColumn dataField="column3" headerText="Column 3"/>
               </s:ArrayList>
          </s:columns>          
     </s:DataGrid>
</s:WindowedApplication>

 

Thanks in Advance!

 

Regards,

Dinko

 
Replies
  • Currently Being Moderated
    Apr 3, 2013 6:40 AM   in reply to dinko_ivanov

    to set the dataProvider of the ComboBoxGridItemEditor dynamically in ActionScript

    I use this:

     

    [code]

    var dataList:ArrayList = new ArrayList(["one", "two", "three"]);

    var cF:ClassFactory = new ClassFactory(ComboBoxGridItemEditor);

    cF.properties = {dataProvider: dataList};

     

    yourEditableColumn.itemEditor = cF;

    [/code]

     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points