[flexcoders] Re: getting the total of values of an array collection that is updated manually

[ZIONIST]

Hi Guys, i have finally got the total to update when new items are added to the 
cart. One thing that i have failed to do is to get the total to update when 
quantity is changed and when a product is removed from the cart(list 
component). Any help on this? Here is the latest code that only gets the total 
to update when a new product is added.

"App"


<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml";
                                layout="horizontal"
                                xmlns:ns1="*"
                                xmlns:ns2="as_logic.*">
        <mx:states>
                <mx:State name="dark">
                        <mx:SetProperty target="{product}"
                                                        name="text"
                                                        value="Dark Chocolate"/>
                        <mx:SetProperty target="{price}"
                                                        name="text"
                                                        value="50"/>
                </mx:State>
                <mx:State name="spread">
                        <mx:SetProperty target="{product}"
                                                        name="text"
                                                        value="Drinking 
Chocolate"/>
                        <mx:SetProperty target="{price}"
                                                        name="text"
                                                        value="100"/>
                </mx:State>
        </mx:states>

        <mx:Script>
                <![CDATA[
                        import mx.controls.listClasses.ListData;
                        import mx.collections.ArrayCollection;

                        [Bindable]
                        private var orderColl:ArrayCollection=new 
ArrayCollection();

                        private function addProduct():void
                        {

                                //Create an object to hold the data
                                var obj:Object=new Object();
                                //Assign the variables to it
                                obj.Product=product.text;
                                obj.Price=price.text;
                                //Add the object to the list
                                orderColl.addItemAt(obj, 0);

                        }

                        public function deleteOrder():void
                        {

                                //Remove the item from the array collection
                                orderColl.removeItemAt(products.selectedIndex);

                        }                       

                        public function init():void
                        {
                                var total:Number=0;
                                for (var i:String in orderColl)
                                {
                                        total+=Number(orderColl[i].Price);
                                }
                                sum.text=usdFormatter.format(total.toString());
                        }
                ]]>
        </mx:Script>

        <mx:DefaultTileListEffect id="dtle0"
                                                          fadeOutDuration="300"
                                                          fadeInDuration="300"
                                                          moveDuration="650"
                                                          color="0xffffff"/>

        <mx:CurrencyFormatter id="usdFormatter"
                                                  precision="0"
                                                  currencySymbol="$"
                                                  alignSymbol="left"/>


        <mx:Canvas width="500"
                           height="300">
                <mx:Label x="10"
                                  y="10"
                                  text="Milk Chocolate"
                                  id="product"/>
                <mx:Label x="10"
                                  y="36"
                                  text="10"
                                  id="price"/>
                <mx:Button x="10"
                                   y="62"
                                   label="submit"
                                   click="addProduct();init()"/>
                <mx:Button x="10"
                                   y="92"
                                   label="Change State"
                                   click="currentState='dark'"/>
                <mx:Button x="10"
                                   y="122"
                                   label="Drinking Chocolate"
                                   click="currentState='spread'"/>
        </mx:Canvas>

        <mx:VBox width="340"
                         height="340"
                         horizontalAlign="center"
                         verticalAlign="middle">

                <ns2:transparentList id="products"
                                                         width="300"
                                                         height="300"
                                                         
dataProvider="{orderColl}"
                                                         borderStyle="none"
                                                         
itemsChangeEffect="{dtle0}">
                        <ns2:itemRenderer>
                                <mx:Component>
                                        <mx:HBox width="100%"
                                                         height="100%"
                                                         
horizontalAlign="center"
                                                         verticalAlign="middle"
                                                         horizontalGap="0">
                                                <mx:Image 
source="assets/trashcan.gif"
                                                                  
click="outerDocument.deleteOrder()"/>
                                                <mx:Label text="{data.Product}"
                                                                  
styleName="orderLabel"/>
                                                <mx:Spacer width="100%"/>
                                                <mx:Label id="price"
                                                                  
text="${Number(qty.text)* Number(oldPrice.text)}"
                                                                  
styleName="orderLabel"/>
                                                <mx:TextInput id="qty"
                                                                          
width="30"
                                                                          
height="20"
                                                                          
text="1"
                                                                          
styleName="qtyInput"/>

                                                <mx:Label id="oldPrice"
                                                                  
text="{data.Price}"
                                                                  
visible="false"
                                                                  
includeInLayout="false"/>
                                        </mx:HBox>
                                </mx:Component>
                        </ns2:itemRenderer>
                </ns2:transparentList>
                <mx:HBox>
                        <mx:Label text="Total:"
                                          color="#FFFFFF"
                                          fontWeight="bold"/>
                        <mx:Label id="sum"/>
                </mx:HBox>
        </mx:VBox>

</mx:Application>