ItemRenderer Question

Question

Hi all,
I have this Component with a DataGroup inside
<?xml version="1.0" encoding="utf-8"?>
<s:TitleWindow 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="init()" close="titlewindow1_closeHandler(event)">
     <fx:Script>
          <![CDATA[
               import com.eworx.seven7eshop.views.presenters.CartPM;
               import mx.collections.ArrayCollection;
               import mx.controls.Alert;
               import mx.events.CloseEvent;
               import mx.managers.PopUpManager;
               import mx.rpc.events.ResultEvent;
               [Bindable]
               public var model:CartPM;
               [Bindable]
               public var total:int;
               private function init():void {
                    XML.ignoreWhitespace = true;
                    XML.prettyPrinting = false;
               protected function titlewindow1_closeHandler(event:CloseEvent):void
                    PopUpManager.removePopUp(this);
               protected function button1_clickHandler(event:MouseEvent):void
                    var params:Object = {};
                    var cartXML:XML = new XML("<order></order>");
                    for each (var item:Object in cartDg.dataProvider) {
                         var pId:String = item.pId;
                         var pName:String = item.pName;
                         var product:XML = <product pId={pId} pName={pName}></product>;
                         cartXML.appendChild(product);
                    params["orders"] = cartXML.toXMLString();
                    saveOrderServ.send(params);
                    model.emptyCart();
               private function totalItems():void {
                    cartDg.dataProvider;
               protected function httpservice1_resultHandler(event:ResultEvent):void
                    Alert.show("SAVED");
          ]]>
     </fx:Script>
     <fx:Declarations>
          <!-- Place non-visual elements (e.g., services, value objects) here -->
          <s:HTTPService id="saveOrderServ" url="http://localhost/Seven7-Eshop-debug/rpc/saveOrders.php" method="POST" result="httpservice1_resultHandler(event)" />
     </fx:Declarations>
     <s:HGroup id="ordersHeader">
          <s:Label id="shoppingCartLabel" text="Shopping Cart" />
          <!--<s:Button label="Hide Details" />-->
     </s:HGroup>
     <s:Group id="marginHolder" width="1000" height="550">
          <s:Rect width="100%" height="100%" radiusX="5" radiusY="5">
               <s:fill>
                    <s:LinearGradient rotation="90">
                         <s:GradientEntry color="0xD8B220" />
                         <s:GradientEntry color="0x986733" />
                    </s:LinearGradient>
               </s:fill>
          </s:Rect>
          <s:Rect width="100%" height="100%" radiusX="5" radiusY="5">
               <s:fill>
                    <s:BitmapFill source="@Embed('garnish/denimPattern.png')" fillMode="repeat" />
               </s:fill>
          </s:Rect>
          <s:VGroup top="25" left="25" width="100%" horizontalAlign="center">
               <s:Scroller  width="950" height="450">
                    <s:DataGroup id="cartDg" width="100%" height="100%" 
                                    dataProvider="{new ArrayCollection(model.cartProducts)}"
                                    itemRenderer="CartListItemRenderer">
                         <s:layout>
                              <s:VerticalLayout gap="50" />
                         </s:layout>
                    </s:DataGroup>
               </s:Scroller>
               <s:Group>
                    <s:BitmapImage source="@Embed('garnish/cartCheckoutBorder.png')" />
                    <s:HGroup verticalAlign="middle">
                         <s:Label id="totalItemsPrice" text="items / € " />
                         <s:Button label="checkout" click="button1_clickHandler(event)" />
                    </s:HGroup>
               </s:Group>
          </s:VGroup>
     </s:Group>
</s:TitleWindow>
And this itemrenderer with a datagrid inside
<?xml version="1.0" encoding="utf-8"?>
<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
                    xmlns:s="library://ns.adobe.com/flex/spark"
                    xmlns:mx="library://ns.adobe.com/flex/mx"
                    autoDrawBackground="false">
     <fx:Script>
          <![CDATA[
               import com.eworx.seven7eshop.events.CartEvent;
               import mx.events.DataGridEvent;
               [Bindable]
               public var total:int = 0;
               protected function color_sizes_itemEditBeginHandler(event:DataGridEvent):void
                    total = 0;
                    for each(var item:Object in color_sizes.dataProvider) {
                         for each(var cell:Object in item) {
                              if(cell > 0) {
                                   total += cell;
          ]]>
     </fx:Script>
     <s:HGroup id="holder" gap="20">
          <mx:Image source="{data.pImage}" />
          <s:VGroup>
               <s:Label id="orderTitle" text="{data.pName}" />
               <s:Group width="100%">
                    <s:HGroup gap="20">
                         <s:Label id="orderProduct" text="{data.pCode}" />
                         <s:Label id="orderPrice" text="€ {data.pPrice}" />
                    </s:HGroup>
                    <s:Label id="previewTotal"  text="Sum: {total} items / € {data.pPrice*total}" right="0" />
               </s:Group>
               <mx:DataGrid
                    id="color_sizes"
                    editable="true"
                    dataProvider="{data.rows}" 
                    color="0x000000" columns="{data.columns}"
                    itemEditBegin="color_sizes_itemEditBeginHandler(event)"
                    />
          </s:VGroup>
     </s:HGroup>
</s:ItemRenderer>
This Datagroup has a datagrid where the user can enter how many items want for each color/size. I can calculate the total items for each datagrid but I need to display the total of all datagrids in the parent component where the datagroup is.
How can I do that?

Answer 1

I would bypass the DataGrid all together.  Using the DataGrid , you have to mess with itemrenderers and indexes ... not
very fun when one can avoid it.  Instead , I would do my calculations off of the dataprovider.  Then it becomes an elementary exercise of a for-loop and [Bindable] values.