Question

I have a form that consists of two data grids and a button. Datagrid 1, “myStaticDataGrid”, has values I have added for the user to select from. I want the button’s click event to send the current selection of myStaticDataGrid to the second datagrid, “myDataGrid”. I have been able to accomplish this if I use a text box and a datagrid but I am having trouble finding the right syntax to grab the selection data from myStaticDataGrid.

This is my attempt using the two datagrid approach:

<s:Form id="myForm">
//The values from this grid are determined once the button is clicked.
  <s:FormItem id="myDataGrid">
    <s:DataGrid id="bdgFormData">
      <s:typicalItem>
        <s:DataItem formData="Description" xmlData="Value"/>
      </s:typicalItem>
      <s:ArrayCollection id="values"> </s:ArrayCollection>
    </s:DataGrid>
  </s:FormItem>


//The values from this grid are determined at runtime.
<s:FormItem id="myStaticDataGrid">
    <s:DataGrid id="userSelects">
        <s:typicalItem>
            <s:DataItem selects="Typical Item" codes="0000"/>
        </s:typicalItem>

        <s:ArrayCollection id="selects">
            <s:DataItem selects="Y" codes="1"/>
            <s:DataItem selects="N" codes="0"/>
        </s:ArrayCollection>
    </s:DataGrid>
</s:FormItem>

<s:FormItem label="Add Selects">
    <s:Button label="Go" click="addData(event)"/>
</s:FormItem>

My AS event to send the data:

protected function addData(event:MouseEvent):void
{

  //Put selected data at the top of the grid.
  items.addItemAt(lstFormData.typicalItem,0)

}

My question is where do I bind the grid data?

This is how I send the textbox data to a the datagrid:

<s:FormItem label="myDataUtil">
  <s:Label text="Value"/>
  <s:TextInput text="@{lstFormData.typicalItem.formData}"/>
</s:FormItem>

Answer 1

I whipped this up for you unfortunately I only have flex 3 here so you will have to make conversions for whatever you need but you should get the idea of how it works.

<?xml version="1.0" encoding="utf-8"?>
  <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="init()">
  <mx:Script>
  <![CDATA[
  import mx.collections.ArrayCollection;
  [Bindable]
  public var originalData:ArrayCollection

  [Bindable]
  public var changingData:ArrayCollection;

  public function init( ):void{
    this.changingData = new ArrayCollection( )
    this.originalData = new ArrayCollection( )
    for( var i:int = 0;i<100;i++){
      var obj:Object = new Object( )
      obj.label = 'slot '+ i;
      obj.value = 's'+i;
      originalData.addItem( obj );
    }
  }

  public function onSelect( e:Event ):void{
    this.changingData.addItem(( e.currentTarget as DataGrid).selectedItem )
  }

  ]]> 
  </mx:Script>

<mx:DataGrid id="myStaticDataGrid" dataProvider="{originalData}"  click="onSelect(event)"/>
<mx:DataGrid id="bdgFormData" dataProvider="{changingData}" x="240" y="0"/>

</mx:Application>

Here is an example without binding data

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" >
    <mx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;

            public function onSelect( e:Event ):void{
                var targetProvider:ArrayCollection = ( bdgFormData.dataProvider as ArrayCollection )
                if( !targetProvider ){
                    targetProvider = new ArrayCollection()
                }
                targetProvider.addItem(( e.currentTarget as DataGrid).selectedItem )
                bdgFormData.dataProvider = targetProvider
            }

    ]]> 
</mx:Script>

<mx:DataGrid id="myStaticDataGrid" click="onSelect(event)" >
    <mx:dataProvider>
        <mx:ArrayCollection >
            <mx:Object label="AIR" />
            <mx:Object label="ColdFusion" />
            <mx:Object label="Dreamweaver" />
            <mx:Object label="Flash" />
            <mx:Object label="Flex" />
            <mx:Object label="Photoshop" />
        </mx:ArrayCollection>
    </mx:dataProvider>
</mx:DataGrid>
<mx:DataGrid id="bdgFormData" x="240" y="0"/>