Question

I’m kinda new to Flex and I’m using Flash Builder 4.5.
I’m so frustrated.. Trying to solve this since yesterday morning and seems like there is just not enough resources to learn more about Flex!

so here is the problem: I have a db field with a “date” DataType and i just can’t order by it the xField! i tried so many things and nothing works.. when i try to order it by the id its working but its not supporting dates or something.

here is the php format for the date:

      $row->date = new DateTime($row->date);
      $row->date = $row->date->format( "d/m/Y" );

now the thing is when I’m trying to make the xField=”date” its not showing the columns and the xField is still [0 20 40 60 etc..].

I’m open to new suggestions, i don’t care about the way i just want to show dates on the xField.

And please, like i said I’m kinda new to flex so please make your answers understandable.

Hope someone will be able to help me with this, thanks guys!

EDIT: here is the whole 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:fanpagesservice="services.fanpagesservice.*"
               width="914" height="636" minWidth="955" minHeight="600" backgroundColor="#000000"
               creationComplete="application1_creationCompleteHandler(event)">
    <fx:Script>
        <![CDATA[
            import mx.charts.events.ChartItemEvent;
            import mx.collections.ArrayCollection;
            import mx.events.FlexEvent;
            import mx.rpc.events.ResultEvent;
            [Bindable] 
            private var Totals:ArrayCollection = new ArrayCollection;
            [Bindable] 
            private var Likes:ArrayCollection = new ArrayCollection;
            [Bindable]
            public var minDate:Date = new Date(2011, 06, 1);
            [Bindable]
            public var maxDate:Date = new Date(2011, 06, 30);

            protected function ResponcerTotals_resultHandler(event:ResultEvent):void
            {
                // TODO Auto-generated method stub
                Totals = event.result as ArrayCollection;

            }

            protected function application1_creationCompleteHandler(event:FlexEvent):void
            {
                // TODO Auto-generated method stub
                ResponderTotals.token = fanpageService.getAllFanpagesTotals();

            }

            protected function ResponderLikes_resultHandler(event:ResultEvent):void
            {
                // TODO Auto-generated method stub
                Likes = event.result as ArrayCollection;
            }

            protected function totalsPie_itemClickHandler(event:ChartItemEvent):void
            {
                // TODO Auto-generated method stub
                ResponderLikes.token = fanpageService.getAllFanpagesStats(event.hitData.item.page_name);
            }

        ]]>
    </fx:Script>
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
        <fanpagesservice:FanpagesService id="fanpageService" />
        <s:CallResponder id="ResponderTotals" result="ResponcerTotals_resultHandler(event)" />

        <s:CallResponder id="ResponderLikes" result="ResponderLikes_resultHandler(event)" />
        <mx:SeriesInterpolate id="interpolate" duration="500"/>
    </fx:Declarations>
    <s:Panel x="18" y="9" width="878" height="613" backgroundColor="#262626" chromeColor="#000"
             color="#FFFFFF" contentBackgroundColor="#262626" fontFamily="Arial" fontSize="14"
             skinClass="spark.skins.spark.PanelSkin" textAlign="center">
        <s:layout>
            <s:BasicLayout/>
        </s:layout>
        <mx:PieChart id="totalsPie" x="10" y="10" itemClick="totalsPie_itemClickHandler(event)" dataProvider="{Totals}" showDataTips="true">
            <mx:series>
                <mx:PieSeries displayName="Series 1" field="likes" nameField="page_name" showDataEffect="{interpolate}"/>
            </mx:series>
        </mx:PieChart>
        <mx:Legend x="11" y="414" width="400" dataProvider="{totalsPie}"/>

        <mx:ColumnChart id="columnchart1" x="432" y="10" width="434" dataProvider="{Likes}"
                        showDataTips="true">
            <mx:series>
                <mx:ColumnSeries displayName="serie" yField="likes" xField="date" showDataEffect="{interpolate}"/>
            </mx:series>
        </mx:ColumnChart>
    </s:Panel>
</s:Application>

Basically there is a pie, when you click on a part of it it needs to show the “likes” in the column chart by dates (how much likes it got everyday). The click part works just the xField=”date” isn’t working.

Answer 1

Simplest thing you can do? Sort it on the php side and send it to Flex, since you obviously know more about PHP than Flex considering you’re using the wizard to create all your Flex code.

If you don’t want to do that, you’ll need to parse your result because your server is just sending a string as the date (not an actual Date object):

protected function ResponderLikes_resultHandler(event:ResultEvent):void
{
    var array:Array = ArrayCollection(event.result).source;
    // Convert string to date object
    for each(var item:Object in array)
    {
        item.timestamp = DateFormatter.parseDateString(item.date).getTime();
    }
    // Sort array
    array.sortOn('timestamp', Array.NUMERIC);
    // Insert into collection presorted
    Likes = new ArrayCollection(array);
}

That should do it, but you’ll need to the same for totals, or just create a function that parses & sorts the data.