Comments on: Dynamically adding new columns to a DataGrid control in Flex http://blog.flexexamples.com/2008/03/04/dynamically-adding-new-columns-to-a-datagrid-control-in-flex/ Just a bunch of Adobe Flex Examples Thu, 18 Mar 2010 14:05:25 +0000 http://wordpress.org/?v=2.9.2 hourly 1 By: Peter deHaan http://blog.flexexamples.com/2008/03/04/dynamically-adding-new-columns-to-a-datagrid-control-in-flex/comment-page-1/#comment-6688 Peter deHaan Sun, 27 Dec 2009 19:13:42 +0000 http://blog.flexexamples.com/2008/03/04/dynamically-adding-new-columns-to-a-datagrid-control-in-flex/#comment-6688 @charlie crystle, In Flex you add data to the data provider (ArrayCollection, etc), not to the control itself. Peter @charlie crystle,

In Flex you add data to the data provider (ArrayCollection, etc), not to the control itself.

Peter

]]> By: charlie crystle http://blog.flexexamples.com/2008/03/04/dynamically-adding-new-columns-to-a-datagrid-control-in-flex/comment-page-1/#comment-6687 charlie crystle Sun, 27 Dec 2009 19:10:25 +0000 http://blog.flexexamples.com/2008/03/04/dynamically-adding-new-columns-to-a-datagrid-control-in-flex/#comment-6687 peter--sorry if this is a stupid question... but why isn't there an explicit method for adding rows to the datagrid? something like dg.AddRow(myObject.name, myObject.job....) the flex datagrid is different from the flash datagrid... http://www.adobe.com/devnet/flash/quickstart/datagrid_pt1/ peter–sorry if this is a stupid question…

but why isn’t there an explicit method for adding rows to the datagrid? something like dg.AddRow(myObject.name, myObject.job….)

the flex datagrid is different from the flash datagrid…

http://www.adobe.com/devnet/flash/quickstart/datagrid_pt1/

]]> By: charlie crystle http://blog.flexexamples.com/2008/03/04/dynamically-adding-new-columns-to-a-datagrid-control-in-flex/comment-page-1/#comment-6686 charlie crystle Sun, 27 Dec 2009 18:04:11 +0000 http://blog.flexexamples.com/2008/03/04/dynamically-adding-new-columns-to-a-datagrid-control-in-flex/#comment-6686 Peter--thanks for this. Not the post itself, but your generosity in the comments. I have found the documentation and samples from Adobe not very well articulated through code samples. The reliance on MXML is just so over the top; MXML is great except when you need flexibility. You should be able to program everything (and you can), but the examples are just not that great. The more emphasis you put on AS3 examples the better. MXML is handy, but for flexibility, AS3 is much more useful and powerful. Peter–thanks for this. Not the post itself, but your generosity in the comments. I have found the documentation and samples from Adobe not very well articulated through code samples. The reliance on MXML is just so over the top; MXML is great except when you need flexibility. You should be able to program everything (and you can), but the examples are just not that great.

The more emphasis you put on AS3 examples the better. MXML is handy, but for flexibility, AS3 is much more useful and powerful.

]]> By: Dinesh Kumar D http://blog.flexexamples.com/2008/03/04/dynamically-adding-new-columns-to-a-datagrid-control-in-flex/comment-page-1/#comment-6494 Dinesh Kumar D Tue, 01 Dec 2009 08:17:01 +0000 http://blog.flexexamples.com/2008/03/04/dynamically-adding-new-columns-to-a-datagrid-control-in-flex/#comment-6494 After i have added or removed the columns from the datagrid, the contents in the datagrid seems to disappear. I have tried assigning the Arraycollection to the dataprovider property of datagrid.. But still i dont see any contents.. could you tell me why? After i have added or removed the columns from the datagrid, the contents in the datagrid seems to disappear. I have tried assigning the Arraycollection to the dataprovider property of datagrid.. But still i dont see any contents.. could you tell me why?

]]> By: Peter deHaan http://blog.flexexamples.com/2008/03/04/dynamically-adding-new-columns-to-a-datagrid-control-in-flex/comment-page-1/#comment-6478 Peter deHaan Fri, 27 Nov 2009 03:20:30 +0000 http://blog.flexexamples.com/2008/03/04/dynamically-adding-new-columns-to-a-datagrid-control-in-flex/#comment-6478 @Dinesh Kumar D, The DataGrid control's <code>columns</code> is just an Array, so you can use array methods to remove columns. For example, the following code removes the first column (using the <code>splice()</code> method) each time you click the button: <pre lang="mxml"> <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"> <mx:Script> <![CDATA[ private function removeColumnAtIndex(idx:uint):void { var cols:Array = dataGrid.columns; cols.splice(idx, 1); dataGrid.columns = cols; } ]]> </mx:Script> <mx:ApplicationControlBar dock="true"> <mx:Button label="Remove column 0" click="removeColumnAtIndex(0);" /> </mx:ApplicationControlBar> <mx:DataGrid id="dataGrid" width="400" rowCount="6"> <mx:columns> <mx:DataGridColumn dataField="col1" /> <mx:DataGridColumn dataField="col2" /> <mx:DataGridColumn dataField="col3" /> <mx:DataGridColumn dataField="col4" /> </mx:columns> <mx:dataProvider> <mx:ArrayCollection> <mx:source> <mx:Array> <mx:Object col1="A.1" col2="A.2" col3="A.3" col4="A.4"/> <mx:Object col1="B.1" col2="B.2" col3="B.3" col4="B.4"/> <mx:Object col1="C.1" col2="C.2" col3="C.3" col4="C.4"/> <mx:Object col1="D.1" col2="D.2" col3="D.3" col4="D.4"/> <mx:Object col1="E.1" col2="E.2" col3="E.3" col4="E.4"/> <mx:Object col1="F.1" col2="F.2" col3="F.3" col4="F.4"/> </mx:Array> </mx:source> </mx:ArrayCollection> </mx:dataProvider> </mx:DataGrid> </mx:Application> </pre> Also, in my previous comment I showed how you can toggle a DataGridColumn's visibility by setting the Boolean <code>visible</code> property. Peter @Dinesh Kumar D,

The DataGrid control’s columns is just an Array, so you can use array methods to remove columns. For example, the following code removes the first column (using the splice() method) each time you click the button:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
 
    <mx:Script>
        <![CDATA[
            private function removeColumnAtIndex(idx:uint):void {
                var cols:Array = dataGrid.columns;
                cols.splice(idx, 1);
                dataGrid.columns = cols;
            }
        ]]>
    </mx:Script>
 
    <mx:ApplicationControlBar dock="true">
        <mx:Button label="Remove column 0" click="removeColumnAtIndex(0);" />
    </mx:ApplicationControlBar>
 
    <mx:DataGrid id="dataGrid"
                 width="400"
                 rowCount="6">
        <mx:columns>
            <mx:DataGridColumn dataField="col1" />
            <mx:DataGridColumn dataField="col2" />
            <mx:DataGridColumn dataField="col3" />
            <mx:DataGridColumn dataField="col4" />
        </mx:columns>
        <mx:dataProvider>
            <mx:ArrayCollection>
                <mx:source>
                    <mx:Array>
                        <mx:Object col1="A.1" col2="A.2" col3="A.3" col4="A.4"/>
                        <mx:Object col1="B.1" col2="B.2" col3="B.3" col4="B.4"/>
                        <mx:Object col1="C.1" col2="C.2" col3="C.3" col4="C.4"/>
                        <mx:Object col1="D.1" col2="D.2" col3="D.3" col4="D.4"/>
                        <mx:Object col1="E.1" col2="E.2" col3="E.3" col4="E.4"/>
                        <mx:Object col1="F.1" col2="F.2" col3="F.3" col4="F.4"/>
                    </mx:Array>
                </mx:source>
            </mx:ArrayCollection>
        </mx:dataProvider>
    </mx:DataGrid>
 
</mx:Application>

Also, in my previous comment I showed how you can toggle a DataGridColumn’s visibility by setting the Boolean visible property.

Peter

]]> By: Dinesh Kumar D http://blog.flexexamples.com/2008/03/04/dynamically-adding-new-columns-to-a-datagrid-control-in-flex/comment-page-1/#comment-6460 Dinesh Kumar D Thu, 26 Nov 2009 06:24:22 +0000 http://blog.flexexamples.com/2008/03/04/dynamically-adding-new-columns-to-a-datagrid-control-in-flex/#comment-6460 Hi, i need to dynamically remove columns from the table.. how can this be done? Hi,

i need to dynamically remove columns from the table.. how can this be done?

]]> By: Peter deHaan http://blog.flexexamples.com/2008/03/04/dynamically-adding-new-columns-to-a-datagrid-control-in-flex/comment-page-1/#comment-5933 Peter deHaan Mon, 05 Oct 2009 18:11:38 +0000 http://blog.flexexamples.com/2008/03/04/dynamically-adding-new-columns-to-a-datagrid-control-in-flex/#comment-5933 @Anonymous, You can set the <code>visible</code> property on each DataGridColumn object, as seen in the following example: <pre lang="mxml"> <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"> <mx:ArrayCollection id="arrColl"> <mx:source> <mx:Object c1="1.One" c2="1.Two" c3="1.Three" /> <mx:Object c1="2.One" c2="2.Two" c3="2.Three" /> <mx:Object c1="3.One" c2="3.Two" c3="3.Three" /> <mx:Object c1="4.One" c2="4.Two" c3="4.Three" /> <mx:Object c1="5.One" c2="5.Two" c3="5.Three" /> <mx:Object c1="6.One" c2="6.Two" c3="6.Three" /> <mx:Object c1="7.One" c2="7.Two" c3="7.Three" /> <mx:Object c1="8.One" c2="8.Two" c3="8.Three" /> <mx:Object c1="9.One" c2="9.Two" c3="9.Three" /> </mx:source> </mx:ArrayCollection> <mx:ApplicationControlBar dock="true"> <mx:Button id="btn1" label="Column 1" toggle="true" selected="true" /> <mx:Button id="btn2" label="Column 2" toggle="true" selected="true" /> <mx:Button id="btn3" label="Column 3" toggle="true" selected="true" /> </mx:ApplicationControlBar> <mx:DataGrid id="dataGrid" dataProvider="{arrColl}" width="300" rowCount="5"> <mx:columns> <mx:DataGridColumn dataField="c1" visible="{btn1.selected}" /> <mx:DataGridColumn dataField="c2" visible="{btn2.selected}" /> <mx:DataGridColumn dataField="c3" visible="{btn3.selected}" /> </mx:columns> </mx:DataGrid> </mx:Application> </pre> Peter @Anonymous,

You can set the visible property on each DataGridColumn object, as seen in the following example:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
 
    <mx:ArrayCollection id="arrColl">
        <mx:source>
            <mx:Object c1="1.One" c2="1.Two" c3="1.Three" />
            <mx:Object c1="2.One" c2="2.Two" c3="2.Three" />
            <mx:Object c1="3.One" c2="3.Two" c3="3.Three" />
            <mx:Object c1="4.One" c2="4.Two" c3="4.Three" />
            <mx:Object c1="5.One" c2="5.Two" c3="5.Three" />
            <mx:Object c1="6.One" c2="6.Two" c3="6.Three" />
            <mx:Object c1="7.One" c2="7.Two" c3="7.Three" />
            <mx:Object c1="8.One" c2="8.Two" c3="8.Three" />
            <mx:Object c1="9.One" c2="9.Two" c3="9.Three" />
        </mx:source>
    </mx:ArrayCollection>
 
    <mx:ApplicationControlBar dock="true">
        <mx:Button id="btn1" label="Column 1" toggle="true" selected="true" />
        <mx:Button id="btn2" label="Column 2" toggle="true" selected="true" />
        <mx:Button id="btn3" label="Column 3" toggle="true" selected="true" />
    </mx:ApplicationControlBar>
 
    <mx:DataGrid id="dataGrid" dataProvider="{arrColl}" width="300" rowCount="5">
        <mx:columns>
            <mx:DataGridColumn dataField="c1" visible="{btn1.selected}" />
            <mx:DataGridColumn dataField="c2" visible="{btn2.selected}" />
            <mx:DataGridColumn dataField="c3" visible="{btn3.selected}" />
        </mx:columns>
    </mx:DataGrid>
 
</mx:Application>

Peter

]]> By: Anonymous http://blog.flexexamples.com/2008/03/04/dynamically-adding-new-columns-to-a-datagrid-control-in-flex/comment-page-1/#comment-5932 Anonymous Mon, 05 Oct 2009 17:43:34 +0000 http://blog.flexexamples.com/2008/03/04/dynamically-adding-new-columns-to-a-datagrid-control-in-flex/#comment-5932 Hi, I am novice in programation and flexo solutions, so I want to hide and unhide a column depending on some dynamic variable. for example if the user select a check, it automatically show one specific column and if the user uncheck, that column is hide. thanks GAP Hi,

I am novice in programation and flexo solutions, so I want to hide and unhide a column depending on some dynamic variable.

for example if the user select a check, it automatically show one specific column and if the user uncheck, that column is hide.

thanks
GAP

]]> By: Bhuvan http://blog.flexexamples.com/2008/03/04/dynamically-adding-new-columns-to-a-datagrid-control-in-flex/comment-page-1/#comment-2716 Bhuvan Mon, 30 Mar 2009 16:07:07 +0000 http://blog.flexexamples.com/2008/03/04/dynamically-adding-new-columns-to-a-datagrid-control-in-flex/#comment-2716 Hello , Could you tell me.. that getting a label from datagrid.. i'm breifly explain... i had a two datagrid first one is draging the image and put into datagrid by [img.name) to imgholder arraycollection second one i have a check a arraycollection of same field of names in array.. first one has randomly pick the image and send it the datagrid.. like [one,three,two..) i want to compare the data from the arraycollection to imgholder ..... if rowcol value of label is equal to the imgholder... if its same mean the list the label is equal.... else its unequal array..... here, i can't make to compare the two datagrid.... could give a code or explain to get.... my code... Thanks & Regrads BHUVAN Hello ,

Could you tell me.. that getting a label from datagrid..

i’m breifly explain…

i had a two datagrid

first one is draging the image and put into datagrid by [img.name) to imgholder arraycollection

second one i have a check a arraycollection of same field of names in array..

first one has randomly pick the image and send it the datagrid.. like [one,three,two..)

i want to compare the data from the arraycollection to imgholder …..

if rowcol value of label is equal to the imgholder… if its same mean the list the label is equal…. else its unequal array…..

here, i can’t make to compare the two datagrid….
could give a code or explain to get….

my code…

Thanks & Regrads
BHUVAN

]]> By: Jonathan http://blog.flexexamples.com/2008/03/04/dynamically-adding-new-columns-to-a-datagrid-control-in-flex/comment-page-1/#comment-2717 Jonathan Thu, 26 Mar 2009 14:13:21 +0000 http://blog.flexexamples.com/2008/03/04/dynamically-adding-new-columns-to-a-datagrid-control-in-flex/#comment-2717 Hey, I have been looking at the example that you provided for adding dynamic columns to a datagrid that is coming back off an httpService. I have a similar issue that I was hoping someone can help with. I currently am getting xml from php (which works fine) but the xml returned is multidimensional and I need to dynamically create a datagrid to handle the xml returned. The structure being returned is as follows: <section> <user> (can be mulitple users) <firstname> <lastname> <document> (will be mutiple) <submissiondate> </document> </user> </section> I am trying to get the data returned into a datagrid to display the section,firstname,lastname,and document as the column headers. Thanks! Hey, I have been looking at the example that you provided for adding dynamic columns to a datagrid that is coming back off an httpService.

I have a similar issue that I was hoping someone can help with. I currently am getting xml from php (which works fine) but the xml returned is multidimensional and I need to dynamically create a datagrid to handle the xml returned. The structure being returned is as follows:

<section>
<user> (can be mulitple users)
<firstname>
<lastname>
<document> (will be mutiple)
<submissiondate>
</document>
</user>
</section>

I am trying to get the data returned into a datagrid to display the section,firstname,lastname,and document as the column headers.

Thanks!

]]>