5 Replies Latest reply on Apr 27, 2007 6:49 AM by Fred in Orlando

    Complex Array/Objects in Datagrid

    Tom_at_etr
      Hi,

      I'm a complete noob to all this but I have a somewhat complex array.....and I know my arrays will only get more complex.


      I can get a single row by putting this as the data provider: {dataProvider[0]['Time']}
      Or, this: {dataProvider[1]['Time']}

      BUT... I want multiple rows in my data grid. I can't seem to figure out how to achieve this.

      Simply putting {dataProvider} returns [object Object] ... putting in {dataProvider[1]} will also return [object Object] .... this is provided my dataFields are specified correctly of course for each level.

      Flash sees these as Objects, it barks at me for trying to convert them to ArrayCollection or anything else.

      I try to make a new array even of just the dataProvider[0]['Time'] entries by specifying newArray[0] = dataProvider[0]['Time'] ... etc. or by trying newArray.push(dataProvider[0]['Article']) ... but this is inside a function (for my remote connection) and I can't get the array back to the public space for use in my data grid... or I'll get an error about not being able to make an object into an array.

      Any clues?? This sounds like such a simple thing ... and of course I found out you can't simply put a statement to loop inside the dataprovider... which would make it super easy.... so what's up?

      Thanks.

      Here's the structure of my array by the way (returned with amfphp) .. which will probably not be indented, sorry.

      Array
      (
      [0] => Array
      (
      [Time] => Array
      (
      [id] => 1
      [created] => 2007-02-25
      [time] => 10
      [notes] => hours (10)
      [project_id] => 1
      [user_id] => 1
      )
      [Project] => Array
      (
      [id] => 1
      [name] => Test Project #1
      [created] => 2007-02-25
      [due] => 2007-02-28
      )
      [User] => Array
      (
      [id] => 1
      [username] => admin
      )
      )

      [1] => Array
      (
      [Time] => Array
      (
      [id] => 2
      [created] => 2007-03-04
      [time] => 4
      [notes] => setup initial layout
      [project_id] => 1
      [user_id] => 1
      )

      [Project] => Array
      (
      [id] => 1
      [name] => Test Project #1
      [created] => 2007-02-25
      [due] => 2007-02-28
      )

      [User] => Array
      (
      [id] => 2
      [username] => tom
      )
      )
      )
        • 1. Re: Complex Array/Objects in Datagrid
          peterent Level 2
          Let's start small.You have an Array of Arrays, like this:

          dataProvider[0].Time = [ value1, value2, ... ]
          dataProvider[1].Project = [value1, value2, ... ]

          The problem is that your data needs to be consistent. Like this:

          dataProvider[0] = {firstName:"Joe", lastName:"Smith", age:26, dateOfBirth:"07/21/1975"};

          But if you have an Array and not an Object, you can use a labelFunction for each column:

          <mx:DataGridColumn headerText="First Name" labelFunction="showFirstName" />
          <mx:DataGridColumn headerText="Last Name" labelFunction="showLastName" />
          etc.

          In a Script block, write:

          private function showFirstName( item:Object, col:* ) : String
          {
          var value:Array = item as Array; // because each dataProvider element is an Array
          return value[0]; // because value[0] is the firstName
          }

          and write a labelFunction for each DataGridColumn, returning the value[index] for that column.

          In your case the object name is going to be different. So this might not work. Can you massage your data into something more consistent?
          • 2. Complex Array/Objects in Datagrid
            Tom_at_etr Level 1
            atually they are an array of objects (when I debug I can see them all) ... I guess my array of arrays (in php) gets output and convert to an array of objects in Flex.

            it says Array and the entries are Objects.... the entries under them are also Objects.

            basically it's Mike Potter's example on here of amfphp and flex... but I'm returning data that's a little more complex.

            Does this still apply if I have Objects under an Array?

            ..also confused about how to "massage" data to something more consistent...I know the array I pasted above isn't indented (and I may have taken some data out to shorten) ... but it's quite easy to follow despite how many levels it has. Also, if it helps to know, I'm actually using CakePHP framework - so that's where the data is coming from. I guess I really can return whatever I want from there, but I'd rather have this entire array for the datagrid.

            I can return, for example, an actual article just fine...which will help me for other parts of the application ... but I guess my disappointment here is that I feel like there should be an easier way of getting your data out of complex arrays... I couldn't even find something equivalent to a print_r() for PHP in Flex. I've used the debugger which has helped a lot of course, but I'm still new to AS3 and I'm just finding it limiting or less flexible than something like PHP.

            For now I guess I'll approach this by making things dumbed down out of PHP sent to Flex. Which creates more work in some cases and more calls to the database which I'd rather not have to.
            • 3. Complex Array/Objects in Datagrid
              Tom_at_etr Level 1
              I figured it out.
              I've posted my research here: http://www.concepthue.com/how-to/cake_flex/

              Basically, I had to simplify the data coming out of CakePHP. I followed Mike Potter's tutorial for a good bit of this.

              I feel it's not 100% optimal, but I believe it follows good practices on CakePHP's end and Flex's end. Potentially more calls to the database may be made though.

              I'm still not happy that there's no way (apparently) to format the data for use in the DataGrid inside Flex.

              Essentially I have to call data to create "special" arrays for the DataGrid. Now there's nothing special about them, just they are different than the arrays I'll use for everything else. Actually, the arrays for the DataGrid are pretty much useless for everything else and they are fairly non-descriptive -- bad organization of information.

              Anyway, it works. So mission accomplished, yay.
              • 4. Re: Complex Array/Objects in Datagrid
                Fred in Orlando
                Similar problem with different data structure

                My data looks like this
                <employee >
                <shift id="1">
                <date>Sun 3-25</date>
                <in0 id="122" >8:00am</in0>
                <in1 id="333" >12:40</in1>
                <out1 id="1234">5:40</out1>
                <total>8.02</total>
                </shift>
                ...

                The datagrid displays the time in the <in1> tag just fine, but when the user clicks on this cell, I need to be able to get the "id" attribute in order to update the DB.

                I'm a newbie and am trying to redo a dojo project in flex. I'm not locked in to the xml pattern shown above. Otherwise my datagrid is working well. snippet below...

                <mx:DataGrid id="punchdetail" itemClick="punchSelected(event);"
                itemRenderer="BackgroundColorRenderer"
                dataProvider="{DetailDS.lastResult.employee.shift}"
                change="editPunch(event);"
                sortableColumns="true">
                <mx:columns>
                <mx:DataGridColumn dataField="id" visible="false" />
                <mx:DataGridColumn dataField="date" headerText="Date"/>
                <mx:DataGridColumn dataField="in0" width="50" headerText="In" />
                <mx:DataGridColumn dataField="out0" width="50" headerText="Out"/>
                <mx:DataGridColumn dataField="total" />
                </mx:columns>
                </mx:DataGrid>
                __________________________________________________________
                private function punchSelected(event:ListEvent):void {
                var col:DataGridColumn = punchdetail.columns[event.columnIndex];
                Alert.show ( " "+punchdetail.selectedItem.col.dataField);
                //Alert.show ( " "+col.dataField);
                //Alert.show ( " "+punchdetail.selectedItem.valueOf());
                }
                Text Text
                • 5. Re: Complex Array/Objects in Datagrid
                  Fred in Orlando Level 1
                  quote:

                  Originally posted by: Fred in Orlando
                  with a week of googling and using the debugger I finally figured it out. for those of you who can use it, here's the relevant code:
                  data is
                  <employee >

                  <shift id="sb00011">
                  <date>Sun 3-25</date>
                  <in0 id="122" >8:00</in0>
                  <in1 id="333" >12:40</in1>
                  <out1 id="1234">5:40</out1>
                  <total>8.02</total>
                  </shift>
                  ...

                  private function punchSelected(event:ListEvent):void {
                  var selected_column:DataGridColumn = punchdetail.columns[event.columnIndex];
                  var selected_column_name:String = selected_column.dataField;
                  var IGNORED_COLUMNS:Array = ["date", "total", "id", "break"];
                  for each (var cname in IGNORED_COLUMNS) {
                  if (selected_column_name == cname) return;
                  }
                  trace(selected_column_name);


                  var x:Object = punchdetail.selectedItem;
                  var selected_cell:Object = x[selected_column_name];
                  if (selected_cell == null) {//empty cell
                  trace( "cell is empty");
                  }else{
                  var id:Object = selected_cell.id;
                  if (id== null) trace ( "cell is empty");
                  else trace("cell id="+id);

                  }
                  }

                  <mx:DataGrid id="punchdetail" " itemClick="punchSelected(event);"