18 Replies Latest reply on Jul 9, 2010 10:18 AM by Joshfromdallas

    Object from Event into Array collection

    Joshfromdallas

      I am using Flash Builder 4 and working on a AIR app. I have a tab navigator in my app and a popup that allows a user to create an order. They can click on a add button to add items to the order, which adds rows to a datagrid. When they click save an event with a actionscript class is fired off and passes the order info with a orderitems Object which needs to be added to an array collection in the main app to be displayed in the pending orders page. The order info goes through fine.

       

      I am having trouble figuring out how to add the event.orderitems which is an object into the localOrderItems:Arraycollection for the orders I use this, i am storing the orders to a Stored Object for when the pc is offline so they can submit them once they are back online. This shows the first item only in the list and I have to exit and renter to see the items.

       

       

       

       

       

       

      private function saveOrder(event:SaveOrder):void

      {

       

       

      // store orders

       

       

      var order:Order = new Order();

      order.storeId = event.storeId;

      order.orderUID = event.orderUID;

      localOrders.addItem(order);

      localOrdersSO.data.orders = localOrders;

      localOrdersSO.flush();

       

       

      //store order items

       

       

       

       

      localOrdersItemsSO.data.items = event.orderItems;

       

      localOrdersItemsSO.flush();

       

       

      PopUpManager.removePopUp(createOrderScreen);

      }

       

       

       

        • 1. Re: Object from Event into Array collection
          jsd99 Level 3

          You can use localOrderItems.source to get at the array that's in the ArrayCollection.  You can manipulate it like any other array, so use .push() to add the new item.

          • 2. Re: Object from Event into Array collection
            Joshfromdallas Level 1

            Thanks for the quick reply,

             

            so I would use:

             

             

            [

             

            Bindable]

             

            var items:Array;

            items.push(event.orderItems);

            localOrdersItems.source(items);

             

             

            I am getting an error maybe I dont understand how to use the constructor and event to update the array collection.

            • 3. Re: Object from Event into Array collection
              jsd99 Level 3

              You should just do localOrderItems.source.push(event.orderItems);

              • 4. Re: Object from Event into Array collection
                Joshfromdallas Level 1

                I added that but the datagrid does not populate with the data? If I do a breakpoint I can see that event.orderItems contains two items and I can see the data, I am passing that localOrdersItems to a compnent with a datagrid.

                • 5. Re: Object from Event into Array collection
                  jsd99 Level 3

                  Joshfromdallas wrote:

                   

                  I added that but the datagrid does not populate with the data? If I do a breakpoint I can see that event.orderItems contains two items and I can see the data, I am passing that localOrdersItems to a compnent with a datagrid.

                  At first I couldn't figure out what was going on here, but after reading the ListBase documentation it is all clear - the datagrid doesn't necessarily use the original object that you feed into it.  So, after you do the push, just reset the dataProvider of the Datagrid back.

                   

                  In my test app, I did this:

                   

                              private function addItem():void {
                                  myarraycollection.source.push({a: ['seven', 'eight', 'nine']});
                                  mygrid.dataProvider = objex;
                              }

                   

                  however, since you are re-assigning the dataProvider, you don't even need to do this fiddling around with arraycollections.  Just push directly onto the array and set the dataprovider to the array.  Flex will turn the array into an ArrayCollection automatically.

                  • 6. Re: Object from Event into Array collection
                    marcbir

                    Arrays are low level objects and do not throw events when data changes, which is how the grid keeps itself updated.  So basically you can use the array to save locally, but once you load it it has to be wrapped for the grid to automatically see updates.  Something like:

                     

                     

                     

                                private var testArr: Array = [{label:"1"}, {label:"2"}, {label:"3"}, {label:"4"}];
                               
                                [Bindable]
                                private var testAL:ArrayList=new ArrayList(testArr);

                     

                     

                        <s:Button click="{testAL.addItem({label:'5'})}" />
                        <mx:DataGrid dataProvider="{testAL}" >
                            <mx:columns>
                                <mx:DataGridColumn headerText="test" dataField="label" width="100"/>
                            </mx:columns>
                        </mx:DataGrid>

                     

                     

                     

                    Again, when saving and loading you can simply do:

                    ... Load SharedObject

                    testAL = new ArrayList(localOrdersSO.data.orders);

                     

                    ... to Save

                    localOrdersSO.data.orders = testAL.source;

                     

                     

                     

                    hth

                    • 7. Re: Object from Event into Array collection
                      Joshfromdallas Level 1

                      I guess I am confused, if I use the code below and add an Order, the items from that order show up in the pending orders page as long as I close the app and reopen. If I add another order and close and reopen the new items show up but the items before get cleared out. I am getting closer I just need it to add the items like the orders table does which is the code above. Is there a way to loop through the data object and add to the array?

                       

                      private

                       

                       

                       

                       

                       

                      function saveOrder(event:SaveOrder):void

                      {

                       

                       

                      // store orders

                       

                       

                      var order:Order = new Order();

                      order.storeId = event.storeId;

                      order.orderUID = event.orderUID;

                      localOrders.addItem(order);

                      localOrdersSO.data.orders = localOrders;

                      localOrdersSO.flush();

                       

                       

                      //store order items

                       

                       

                      localOrdersItems.source.push(event.orderItems);

                      localOrdersItemsSO.data.items = event.orderItems;

                      localOrdersItemsSO.flush();

                       

                       

                      PopUpManager.removePopUp(createOrderScreen);

                      }

                       

                      • 8. Re: Object from Event into Array collection
                        jsd99 Level 3

                        After you do the push, just set the datagrid's dataProvider property to the ArrayCollection and it will update.

                        • 9. Re: Object from Event into Array collection
                          Joshfromdallas Level 1

                          I think I found the problem, I don't knwo why and don't know how to fix but using the Variables Debugger I see that it is creating an array inside the array ?:

                           

                          I see newArr [0] event.items [0] item1 [1] item2

                           

                          Wierd huh, I guess i need to figure out how to extrant the event object into the arrat without causing it to put it inside like that.

                          • 10. Re: Object from Event into Array collection
                            jsd99 Level 3

                            Sounds like you're pushing an array onto another array.  That would give you the result you are seeing.

                            • 11. Re: Object from Event into Array collection
                              David_F57 Level 5

                              hi,

                               

                              this is a simple example of using a shared object to store data from an arraycollection, if the shared object is empty nothing happens otherwise any data you enter will be added to the array then saved to the shared object. Next time you start the app it will all be there

                               

                              <?xml version="1.0" encoding="utf-8"?>

                              <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"

                                 xmlns:s="library://ns.adobe.com/flex/spark"

                                 xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" creationComplete="application1_creationCompleteHandler(event)">

                              <fx:Declarations>

                              <!-- Place non-visual elements (e.g., services, value objects) here -->

                              </fx:Declarations>

                              <fx:Script>

                              <![CDATA[

                              import mx.collections.ArrayCollection;

                              import mx.events.FlexEvent;

                               

                              private var MyID:SharedObject;

                               

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

                               

                              protected function application1_creationCompleteHandler(event:FlexEvent):void

                              {

                              MyID = SharedObject.getLocal("newData","/");

                              if (MyID.data.info != null) myArr = MyID.data.info;

                              }

                               

                               

                              protected function button1_clickHandler(event:MouseEvent):void

                              {

                              var newData:Object = {

                              name : ti1.text,

                              age  : ti2.text

                              };

                              myArr.addItem(newData);

                              MyID.data.info = myArr;

                              MyID.flush();

                              }

                               

                              ]]>

                              </fx:Script>

                              <mx:DataGrid x="136" y="240" dataProvider="{myArr}">

                              <mx:columns>

                              <mx:DataGridColumn headerText="Column 1" dataField="name"/>

                              <mx:DataGridColumn headerText="Column 2" dataField="age"/>

                              </mx:columns>

                              </mx:DataGrid>

                              <s:Button x="136" y="191" label="Save" click="button1_clickHandler(event)"/>

                              <s:Label x="136" y="85" text="Name"/>

                              <s:Label x="139" y="119" text="Age"/>

                              <s:TextInput x="192" y="80" id="ti1"/>

                              <s:TextInput x="192" y="113" id="ti2"/>

                              </s:Application>

                              • 12. Re: Object from Event into Array collection
                                Joshfromdallas Level 1

                                I wonder how I can add the data from the one array to the other array?

                                 

                                the event.orderItems is an array that gets passed from the AddOrder Class.

                                 

                                the event.orderitems:Object = orderItemsDG.dataprovider

                                 

                                Thaks for the help I think we are getting close to the solution.

                                • 13. Re: Object from Event into Array collection
                                  Joshfromdallas Level 1

                                  I am going to add a screeshot of what the array looks like with a array colelction in it. I found that if I push

                                  events.orderItems[0] data paopulates but of course I only get one item. is there a

                                  [ ] variable that tells it to pull all items? or a way to push the data from the orderitems into the array collection.

                                   

                                  FlexProb.jpg

                                  Thanks for taking the time to help!

                                  • 14. Re: Object from Event into Array collection
                                    jsd99 Level 3

                                    You'll need to write a for each loop to loop over all the items  and push them one at a time.

                                    • 15. Re: Object from Event into Array collection
                                      Joshfromdallas Level 1

                                      Do you know of a link or example of a loop, I havne't really done anything like that yet.

                                      • 16. Re: Object from Event into Array collection
                                        Joshfromdallas Level 1

                                        cool, I got it working:

                                         

                                        for each

                                         

                                         

                                         

                                         

                                         

                                        (var item in event.orderItems) {

                                         

                                        //testArr.push(item);

                                        localOrdersItems.source.push(item);

                                        }

                                         

                                         

                                        However when I go to add another order it does not update, I think I need to

                                        add a refresh array liine to it.

                                         

                                        • 18. Re: Object from Event into Array collection
                                          Joshfromdallas Level 1

                                          yep adding the localOrdersItems.refrsh(); at the end does the trick all working now, thanks man for all your help