4 Replies Latest reply on Jun 22, 2009 9:35 PM by kolban1

    Datagrids displaying all data in two columns

    rattlemania Level 1



      With datagrid control, data is normally displayed as a number of columns each with a header and data for that column.


      I have a database and I want to display all the column names in first column and the data in the second column. Is it possible to have a two column datagrid which displays in one column for all the headings from the database and in second column all the data for those headings?




      Name OneData One
      Name TwoData Two
      Name ThreeData Three
      Name FourData Four


      Please excuse but am new to Flex.

        • 1. Re: Datagrids displaying all data in two columns
          Flex harUI Adobe Employee

          What do your data objects look like?


          Alex Harui

          Flex SDK Developer

          Adobe Systems Inc.

          Blog: http://blogs.adobe.com/aharui

          • 2. Re: Datagrids displaying all data in two columns
            *Prashant Shelke* Level 4

            While preparing data on server-side you need to set schema columns as Object.label & value for that column as Object.data then this dataProvider you need to set on client-side.(dataProvider length = number of columns in schema)

            • 3. Re: Datagrids displaying all data in two columns
              rattlemania Level 1

              Thanks for the replies.


              I don't seem to have maybe given you to full information.  This is an AIR app and I have added a snippet of my code below:



                        var stmt:SQLStatement = new SQLStatement();
                              stmt.sqlConnection = sqlConn;
                              stmt.text = "SELECT * FROM project";
                              var result:SQLResult = stmt.getResult();
                              acGrid = new ArrayCollection(result.data);   
                  <mx:VBox left="10" right="10" top="5" width="300">       
                  <mx:DataGrid id="dg" dataProvider="{acGrid}" resizableColumns="false"
                      variableRowHeight="true" width="250" rowCount="20">
                          <mx:DataGridColumn dataField="prjid" headerText="Project ID" width="75"/>
                          <mx:DataGridColumn dataField="projectref" headerText="Project.Ref"/>
                          <mx:DataGridColumn dataField="productionname" headerText="Prod.Name"/>
                          <mx:DataGridColumn dataField="datecreated" headerText="Created"/>           


              This is to test that I can retrieve the data from the database into the datagrid and this works.


              This produces a datagrid like this:


              Project ID
              Project Ref


              But when I need to achieve is:


              Project ID1
              Project Ref.ABC
              Prod. NameNAME


              A two column datagrid


              Thank you for your help and sorry for any confusion.

              • 4. Re: Datagrids displaying all data in two columns

                Here is a sample program that may help.


                <?xml version="1.0" encoding="utf-8"?>
                <mx:WindowedApplication initialize="init()" xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
                        import mx.collections.ArrayCollection;
                        private var myObject:Object = {"A":"a value", "B": "b value", "c": "c value"};
                        [Bindable] private var myData:ArrayCollection = new ArrayCollection();
                        private function init():void
                            for (var key:String in myObject)
                                myData.addItem({"Label": key, "Data": myObject[key]});
                    <mx:DataGrid x="77" y="50" dataProvider="{myData}">
                            <mx:DataGridColumn headerText="Labels" dataField="Label"/>
                            <mx:DataGridColumn headerText="Data" dataField="Data"/>


                It takes a single Object and displays the properties of that object in two columns, one with the name and one with the value.  In your example, you are retrieving data from a table.  What if the table returns more than one row?  Doesn't that mean you will have duplicate names in your "Labels" column?  I'm not sure this is what you are after.