Solved

populating key values from arraycollection

Posted on 2011-09-13
5
319 Views
Last Modified: 2012-05-12
hi guys

I have a requirment where i have a arraylist

public var frequency:ArrayCollection = new ArrayCollection();

I want to store these values in the ArrayCollection

1, weekly
2, monthly
3, Yearly

On the screen I am displaying dropdown with the frequency ArrayCollection like this

private function createColumn(columnIndex:int,fieldObject:Object):AdvancedDataGridColumn{
var column:AdvancedDataGridColumn = new AdvancedDataGridColumn();
var factory:ClassFactory;
if(fieldObject.hasOwnProperty("cellType")){            
column.editable = true;
if(fieldObject.cellType=="combo"){
factory  = new ClassFactory(ComboBox);
factory.properties= {dataProvider:frequency}; //display frequency ArrayCollection here
column.itemEditor = factory;                              
}
}

In the dropdown i want weekly, monthly or Yearly to be displayed but when user submits the screen it should submit 1,2,3 to the backend.


Any idea how i can do this?

thanks

0
Comment
Question by:royjayd
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
  • 2
5 Comments
 

Author Comment

by:royjayd
ID: 36532578
I am not sure if ArrayCollection is appropriate to store such key/value pairs
0
 
LVL 11

Accepted Solution

by:
petiex earned 300 total points
ID: 36532790
var frequency:ArrayCollection = new ArrayCollection(
                      [{data:1, label: "Weekly"},
                       {data:2, label:"Monthly"},
                       {data:3, label:"Yearly"}
                      ]
                        );
0
 

Author Comment

by:royjayd
ID: 36532920
thanks. in the drop down i see Weekly, Monthly and Yearly
but how can i  set the value of 'data' in the frequency:ArrayCollection

i want to set the value of 'data'  to 1 , 2 or 3

thanks
0
 
LVL 29

Assisted Solution

by:dgofman
dgofman earned 200 total points
ID: 36533083
You need to use labelFunction and in this function you can customize you label output.

<mx:ComboBox labelFunction="calendarLabelFunction" ...

private function calendarLabelFunction(item:Object):String{
   return item.label + " (" + item.data + ")";
}
0
 
LVL 11

Expert Comment

by:petiex
ID: 36539056
Here's something that works:
<?xml version="1.0" encoding="utf-8"?>
<mx: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" width="100%" height="100%" creationComplete="myinit()">
    <fx:Script><![CDATA[
        import mx.collections.ArrayCollection;
        import mx.controls.Alert;
        import mx.controls.advancedDataGridClasses.AdvancedDataGridColumn;
        import mx.controls.ComboBox;

        [Bindable]
        public var dataProv:Array = [
            {name:"Helen", frequency:1},
            {name:"Fred", frequency:2},
            {name:"Alphonse",frequency:3}
        ];
        public var frequency:ArrayCollection = new ArrayCollection([
            {data:0, label:""},
            {data:1, label:"Weekly"},
            {data:2, label:"Monthly"},
            {data:3, label:"Yearly"}
        ]);

        private function myinit():void {
            var dataFields:Array = [
                {columnHeader:"Frequency", cellType:"combo", dataField:"frequency"},
                {columnHeader:"Name", dataField:"name"}
            ];

            var idx:int = 0;
            var cols:Array = [];
            for each (var obj:Object in dataFields) {
                cols.push(createColumn(idx++, obj));
            }
            datagrid.columns = cols;
            datagrid.dataProvider = dataProv;
        }

        private function showNewData():void {
            var newData:String = "";
            for each (var obj:Object in dataProv){
                newData += "name: "+obj.name +", frequency: "+obj.frequency+"; ";
            }
            Alert.show(newData);
        }

        private function createColumn(columnIndex:int, fieldObject:Object):AdvancedDataGridColumn {
            var column:AdvancedDataGridColumn = new AdvancedDataGridColumn();
            column.dataField = fieldObject.dataField;
            column.headerText = fieldObject.columnHeader;
            if (fieldObject.cellType) {
                var factory:ClassFactory;
                column.editable = true;
                if (fieldObject.cellType == "combo") {
                    factory = new ClassFactory(ComboBox);
                    factory.properties = {dataProvider:frequency};
                    column.itemEditor = factory;
                    column.editorDataField = "selectedIndex";
                    column.labelFunction = function(obj:Object, dgc:AdvancedDataGridColumn):String {
                        return frequency[obj[dgc.dataField]].label
                    };
                }
            }
            else column.editable = false;
            return column;
        }


        ]]></fx:Script>
    <mx:AdvancedDataGrid id="datagrid" editable="true">
        <mx:columns/>
    </mx:AdvancedDataGrid>
    <mx:Button click="showNewData()" label="Show new data"/>
</mx:Application>

Open in new window

0

Featured Post

Connect further...control easier

With the ATEN CE624, you can now enjoy a high-quality visual experience powered by HDBaseT technology and the convenience of a single Cat6 cable to transmit uncompressed video with zero latency and multi-streaming for dual-view applications where remote access is required.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

First things first - Preparation We need all the part for this install and it's much nicer to have them all on hand when you need them so here's what's required. Download Eclipse 3.5 32 bit (I like the Classic flavour) from here. (http://www.e…
This article is in regards to the Cisco QSFP-4SFP10G-CU1M cables, which are designed to uplink/downlink 40GB ports to 10GB SFP ports. I recently experienced this and found very little configuration documentation on how these are supposed to be confi…
NetCrunch network monitor is a highly extensive platform for network monitoring and alert generation. In this video you'll see a live demo of NetCrunch with most notable features explained in a walk-through manner. You'll also get to know the philos…
Sometimes it takes a new vantage point, apart from our everyday security practices, to truly see our Active Directory (AD) vulnerabilities. We get used to implementing the same techniques and checking the same areas for a breach. This pattern can re…

626 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question