1 Reply Latest reply on Nov 6, 2007 1:28 PM by ntsiii

    Repeater Qs

    trycold Level 1
      Hi,

      I am using a repeater to create couple of texInputs like quantity,cost etc. What i want is whatever is entered in quantity and cost I need to calculate the total cost for that particular row. I have 5 such rows. So I have something like this:

      arrItem = new Array(
      {Line:"1",Description:"",Quantity:"",UnitCost:"",CalCost:""},
      {Line:"2",Description:"",Quantity:"",UnitCost:"",CalCost:""},
      {Line:"3",Description:"",Quantity:"",UnitCost:"",CalCost:""},
      {Line:"4",Description:"",Quantity:"",UnitCost:"",CalCost:""},
      {Line:"5",Description:"",Quantity:"",UnitCost:"",CalCost:""}
      }

      <mx:ArrayCollection id="myAC" source="{arrItem}"/>
      <mx:Grid width="100%" height="100%">
      <mx:Repeater dataProvider="{myAC}" id="itemRepeater">
      <mx:GridRow>
      <mx:GridItem>
      <mx:Text text="{itemRepeater.currentItem.Line}" />
      </mx:GridItem>
      <mx:GridItem>
      <mx:TextInput id="Description" />
      </mx:GridItem>
      <mx:GridItem>
      <mx:TextInput id="Quantity" />
      </mx:GridItem>
      <mx:GridItem>
      <mx:TextInput id="UnitCost" />
      </mx:GridItem>
      <mx:GridItem>
      <mx:TextInput id="TotalCost" />
      </mx:GridItem>
      </mx:GridRow>
      </mx:Repeater>
      </mx:Grid>

      What I need is totalcost is quantity*unitcost. How do I access the repeater to calculate for everyrow.

      Thanks
        • 1. Re: Repeater Qs
          ntsiii Level 3
          Create a custom component, that contains the controls and the logic to calculate and display the total.

          Repeat that component, passing in a reference the the entire itemRepeater.currentItem. implement a public property (a setter function or public var) on the component to receive the currentItem.

          You will find that things like what you want are extremely simple done this way. Below are some snippets.
          Tracy

          When working with Repeater, I advise creating a custom component that you will repeat, and pass it the entire "currentItem", In the component, implement a "setter" function to receive the currentItem data.

          Now, in the component, you can code normally, binding to the data as you wish, without the hard to read currentItem references. You also avoid the binding warnings without the cast/conversion because the binding source is a true XML object.

          And, you can dispatch events normally. In the event handler, you can reference the component via the event.target property, and thus get a direct reference to the dataProvider item. This is easier to write and read than having to use getRepeaterItem().

          Here are some code snippets:

          In the main app or component (note how "clean" and readable this is):
          <mx:Application
          <mx:VBox ...>
          <mx:Repeater id="rp" dataProvider="{_xmlData}" ...>
          <mycomp:MyRepeatedComponent xmlItem="{rp.currentItem}" .../>
          </mx:Repeater
          </mx:VBox>

          And in the component, MyRepeatedComponent.mxml:
          <?xml version="1.0" encoding="utf-8"?>
          <mx:HBox ...
          <mx:Script><![CDATA[
          [Bindable]private var _xmlItem:XML;

          public function set xmlData(xml:XML):void
          {
          _xmlItem = xml;
          //do any special, non-bound ui stuff you want
          }//
          ]]></mx:Script>
          <!-- Now declare the Item UI -->
          <mx:Text id="lbDescription" text="{_xmlItem.@description}" width="100%" height="100%" />