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

[ZIONIST]

Hi Guys, i would like to get the total price calculated as an array collection 
for a list is populated plus i would like to update the total when the quantity 
changes too. Here is the code i have so far, could someone please help me 
correct it.

"Main App"
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml";
                                layout="horizontal"
                                xmlns:ns1="*">
        <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.addItem(obj);

                        }

                        private function deleteOrder():void
                        {

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

                        }

                        private function init():void
                        {
                                var n:int=orderColl.length;
                                var total:Number=0;
                                for (var i:int=0; i < n; i++)
                                {
                                        
//total+=orderColl[i][products.item.Price];
                                        total+=orderColl[i].Price++;
                                }
                                sum.text=total.toString();

                        }
                ]]>
        </mx:Script>

        <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">
                <mx:List id="products"
                                 width="300"
                                 height="300"
                                 dataProvider="{orderColl}"
                                 itemRenderer="orderRenderer"/>
                <mx:HBox>
                        <mx:Label text="Total:"
                                          color="#FFFFFF"
                                          fontWeight="bold"/>
                        <mx:Label id="sum"
                                          text="${}"/>
                </mx:HBox>
        </mx:VBox>

</mx:Application>


"Item Renderer (orderRenderer.mxml)"

<?xml version="1.0" encoding="utf-8"?>
<mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml";
                 width="100%"
                 height="100%"
                 horizontalAlign="center"
                 verticalAlign="middle"
                 horizontalGap="0">     

        <mx:Image source="assets/trashcan.gif"/>
        <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>