IMHO - you should create a separate bindable string and set the value to that instead of directly setting the .text property of a text field. Your reduce function seems ok - just run each object through the filter function to see if it returns true. Only objects that return true should be added to the sum.
You are 99% of the way there. What is tripping you up? Sent from my iPhone > On Aug 29, 2014, at 4:55 AM, "stinas...@yahoo.com [flexcoders]" > <flexcoders@yahoogroups.com> wrote: > > Hello, i have a flex list that is populated by an arraycollection. in the > arraycollection i have a field subTotal and i would like to calculate the > subtotals from that field and pin them to a text component and i would like > to do that even when the list is filtered. below is my code > > <?xml version="1.0" encoding="utf-8"?> > <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"; > layout="vertical" > width="100%" > height="100%" > verticalAlign="top" > verticalGap="0" > paddingTop="0" > paddingBottom="0" > paddingLeft="0" > paddingRight="0" > xmlns:ns1="ascript.*" > creationComplete="init()" > initialize="initDate()" > xmlns:ns2="components.*"> > > <mx:Style source="css/styleSheet.css"/> > > <mx:Script> > <![CDATA[ > import components.newEntryForm; > import mx.collections.ArrayCollection; > import mx.controls.Alert; > import mx.managers.CursorManager; > import mx.managers.PopUpManager; > import mx.rpc.events.ResultEvent; > import mx.events.CollectionEvent; > > protected const MAX_DATE:Date=new Date(2020, 11, 31); > > /******************* code to Filter based on Date Range > *****************************/ > > protected const MIN_DATE:Date=new Date(2014, 0, 1); > > /******************* Start Pop Ups *****************************/ > private var add_win:newEntryForm; > > > /******************* code to get Expense Details > *****************************/ > [Bindable] > private var expenseAr:ArrayCollection; > > protected function arrColl_filterFunc(item:Object):Boolean > { > var cDate:Number=Date.parse(item.hireDate); > > if (!sDate || !eDate) > { > return true; > } > > if (sDate.selectedDate && eDate.selectedDate) > { > return (sDate.selectedDate.time <= cDate) && > (eDate.selectedDate.time >= cDate); > } > else if (sDate.selectedDate) > { > return sDate.selectedDate.time <= cDate; > } > else if (eDate.selectedDate) > { > return eDate.selectedDate.time >= cDate; > } > else > { > return true; > } > > //expenseAr.addEventListener(CollectionEvent.COLLECTION_CHANGE, calculateSum); > } > > protected function initDate():void > { > sDate.selectedDate=MIN_DATE; > sDate.selectableRange={rangeStart: MIN_DATE, rangeEnd: > MAX_DATE}; > > eDate.selectedDate=MAX_DATE; > eDate.selectableRange=sDate.selectableRange; > } > > private function createdaddPopup():void > { > add_win=newEntryForm(PopUpManager.createPopUp(this, > newEntryForm, true)); > } > > private function expenseResult(event:ResultEvent):void > { > expenseAr=event.result as ArrayCollection; > expenseAr.filterFunction=arrColl_filterFunc; > expenseAr.refresh(); > } > > private function init():void > { > moRentalsSvc.getExpense(); > > //expenseAr.addEventListener(CollectionEvent.COLLECTION_CHANGE, calculateSum); > } > > public function calculateSum(event:CollectionEvent):void > { > var amt:Number=0; > var n:int=expenseAr.length; > for (var i:int=0; i < n; i++) > { > var expenseEntry:Object=expenseAr.getItemAt(i); > amt+=expenseEntry.subTotal; > } > sum.text=ugxftr.format(amt.toString()); > } > ]]> > </mx:Script> > > <mx:RemoteObject id="moRentalsSvc" > destination="ColdFusion" > source="moRentals.src.CFCs.crud" > showBusyCursor="true" > > fault="CursorManager.removeBusyCursor();Alert.show(event.fault.message)"> > > <mx:method name="getExpense" > result="expenseResult(event)"/> > > </mx:RemoteObject> > > <mx:CurrencyFormatter id="ugxftr" > precision="0" > thousandsSeparatorTo="," > useThousandsSeparator="true" > rounding="up" > currencySymbol="UGX "/> > > <mx:DateFormatter id="dateFormat" > formatString="MMMM DD, YYYY"/> > > <mx:HBox styleName="header" > width="100%" > height="50" > verticalAlign="middle" > verticalGap="0"> > <mx:Image source="assets/logo.png"/> > <mx:Spacer width="100%"/> > <mx:Label text="Logged in as: Aaliyah Ntulo"/> > <mx:Image source="assets/power.png"/> > > </mx:HBox> > <mx:HBox width="100%" > height="100%" > horizontalGap="0"> > <mx:VBox width="200" > height="100%" > verticalGap="0" > backgroundColor="#818284" > horizontalAlign="center"> > > <ns2:menuButton> > <mx:Image source="assets/dashboard.png"/> > <mx:Label text="Dashboard"/> > </ns2:menuButton> > <ns2:menuButton> > <mx:Image source="assets/drivers.png"/> > <mx:Spacer/> > <mx:Label text="Drivers"/> > </ns2:menuButton> > <ns2:menuButton> > <mx:Image source="assets/car.png"/> > <mx:Spacer/> > <mx:Label text="Vehicles"/> > </ns2:menuButton> > > </mx:VBox> > <mx:VBox height="100%" > backgroundColor="#FFFFFF" > verticalGap="0"> > > > <mx:HBox width="100%" > paddingLeft="40" > paddingRight="45" > verticalAlign="middle" > height="66"> > > <mx:Label text="Filter From:" > styleName="listLabel"/> > <mx:DateField id="sDate" > change="expenseAr.refresh();"/> > <mx:Label text="To:" > styleName="listLabel"/> > <mx:DateField id="eDate" > change="expenseAr.refresh();"/> > <mx:Spacer width="100%"/> > <mx:Button label="New Entry" > click="createdaddPopup()"/> > > > </mx:HBox> > > <mx:HRule width="100%"/> > > <mx:HBox width="100%" > paddingLeft="40" > paddingRight="46" > verticalAlign="middle" > height="36"> > > <mx:Label text="DATE" > width="120" > styleName="listLabelHeading"/> > <mx:Label text="MACHINE" > width="90" > styleName="listLabelHeading"/> > <mx:Label text="OPERATOR" > width="130" > styleName="listLabelHeading"/> > <mx:Label text="INCOME" > width="90" > styleName="listLabelHeading"/> > <mx:Label text="EXPENDITURE" > width="90" > styleName="listLabelHeading"/> > <mx:Label text="PROFIT" > width="90" > styleName="listLabelHeading"/> > > </mx:HBox> > > <mx:HRule width="100%"/> > > <ns1:transparentList id="expenseList" > width="100%" > dataProvider="{expenseAr}" > itemRenderer="renderers.expenseListRenderer" > selectedIndex="0" > height="100%" > paddingBottom="0" > borderSkin="{null}"/> > <mx:HBox width="100%" > backgroundColor="#0F76BB" > height="35" > verticalAlign="middle" > paddingLeft="20" > paddingRight="20"> > <mx:Label text="Opening Balance:"/> > <mx:Label text="UGX 30,000,000"/> > <mx:Spacer width="100%"/> > <mx:Label text="Total for the Day"/> > <mx:Label id="sum"/> > </mx:HBox> > </mx:VBox> > > <mx:VBox width="100%" > height="100%" > backgroundColor="#E7E7E8" > verticalGap="0"> > > <mx:HBox width="430" > verticalAlign="middle" > height="73" > backgroundColor="#818284" > paddingLeft="24"> > <mx:Label x="10" > y="10" > text="Details of Hired Machine"/> > </mx:HBox> > <mx:Spacer height="10"/> > <mx:HBox width="100%" > paddingLeft="24"> > <mx:Image width="80" > height="80" > > source="assets/drivers/{expenseList.selectedItem.picture}"/> > <mx:VBox width="100%" > height="80"> > <mx:HBox width="100%"> > <mx:Label text="Operator:" > styleName="listLabel"/> > <mx:Text text="{expenseList.selectedItem.fullname}"/> > </mx:HBox> > <mx:HRule width="100%"/> > <mx:HBox width="100%" > height="100%" > verticalAlign="middle"> > <mx:Image source="assets/add.png"/> > <mx:Text text="Add"/> > <mx:Spacer width="15"/> > <mx:Image source="assets/statistics.png"/> > <mx:Text text="Statistics"/> > <mx:Spacer width="15"/> > <mx:Image source="assets/edit1.png"/> > <mx:Text text="Edit"/> > </mx:HBox> > <mx:HRule width="100%"/> > </mx:VBox> > </mx:HBox> > <mx:Spacer height="15"/> > <mx:VBox width="100%" > paddingLeft="24"> > > <mx:HBox width="100%" > horizontalGap="12"> > <mx:Label text="Date of Hire:" > styleName="listLabel" > width="125"/> > <mx:Text > text="{dateFormat.format(expenseList.selectedItem.hireDate)}"/> > </mx:HBox> > > <mx:HBox width="100%" > horizontalGap="12"> > <mx:Label text="Machine:" > styleName="listLabel" > width="125"/> > <mx:Text text="{expenseList.selectedItem.machineNumber}"/> > </mx:HBox> > > <mx:HBox width="100%" > horizontalGap="12"> > <mx:Label text="Distance Moved:" > styleName="listLabel" > width="125"/> > <mx:Text text="{expenseList.selectedItem.distanceMoved} > Km(s)"/> > </mx:HBox> > > <mx:HBox width="100%" > horizontalGap="12"> > <mx:Label text="Meter Reading:" > styleName="listLabel" > width="125"/> > <mx:Text text="{expenseList.selectedItem.mileage} Km(s)"/> > </mx:HBox> > > <mx:HBox width="100%" > horizontalGap="12"> > <mx:Label text="Amount Hired:" > styleName="listLabel" > width="125"/> > <mx:Text > text="{ugxftr.format(expenseList.selectedItem.revenue)}"/> > </mx:HBox> > > <mx:HBox width="100%" > horizontalGap="12"> > <mx:Label text="Expense:" > styleName="listLabel" > width="125"/> > <mx:Text > text="{ugxftr.format(expenseList.selectedItem.expense)}"/> > </mx:HBox> > > <mx:HBox width="100%" > horizontalGap="12"> > <mx:Label text="Reason for Expense:" > styleName="listLabel" > width="125"/> > <mx:Text text="{expenseList.selectedItem.expenseReason}" > width="100%"/> > </mx:HBox> > > <mx:HBox width="100%" > horizontalGap="12"> > <mx:Label text="Total:" > styleName="listLabel" > width="125"/> > <mx:Text > text="{ugxftr.format(expenseList.selectedItem.subTotal)}"/> > </mx:HBox> > > </mx:VBox> > <mx:Spacer height="10"/> > <mx:HBox width="430" > height="35" > backgroundColor="#818284" > verticalAlign="middle" > paddingLeft="24"> > <mx:Label text="Job Description"/> > </mx:HBox> > <mx:Spacer height="10"/> > <mx:Text text="{expenseList.selectedItem.description}" > width="430" > paddingLeft="24" > paddingRight="24"/> > > </mx:VBox> > > </mx:HBox> > > </mx:Application> > > > > > > >
