Posted on by JesterXL

Flex Chronicles #19: DataGrid columnsChanged

I was building this component to work with the DataGrid. It needs to to really “understand” the DataGrid, and part of that is being very intimate with how the DataGrid’s columns work. This is an array that holds DataGridColumns. These give data on how to draw the grid. The component needed to redraw itself if you passed in custom columns, just like if you passed in a custom array for the DataGrid. Additionally, it needed to update when the DataGrid itself had its columns changed.

Typically that last one is a rare use case, at least in my experience. You don’t go dynamically adding & removing DataGrid columns. However, if you do not explicitly set a columns array for the DataGrid, it has to read the first object of the dataProvider you send it (typically an array of objects). It then generates the columns from this object. The problem is, this initial event of generating columns does NOT fire a columnsChanged event. It was hard enough getting at the source code for the DataGrid, and I certainly can’t start building a stockpile of modified mx components in our class tree else I risk the portability of our code. Don’t get me wrong, I’d love to, there are a ton of little things I’d change, nothing big.

So what to do? Fix the function. This is easy in AS2; you just modify the prototype. This fix basically tells the DataGrid to call it’s existing generateColumns method, but in addition, dispatch the same event it’s getter / setter does so those who care can be informed.

DataGrid.prototype._generateCols = DataGrid.prototype.generateCols;
DataGrid.prototype.generateCols = function():Void
{
        this._generateCols();
        this.dispatchEvent({type:"columnsChanged"});
};

Yes, yes, I know… “Stop blogging about Flex 1.5, Jesse. Blog about Flex 2 instead!”.

Dude, it’s up to my client, not me… I’m working on it!

6 Replies to “Flex Chronicles #19: DataGrid columnsChanged”

  1. Hi,
    I am not sure whether this is the right place to ask this question. I am a noobie to flex. I am trying to get a DataGrid working here. My probs is that my datagrid should refresh ever x seconds. Now, The simplest option as I understand would be to just replace the dataProvider ever x seconds usinga timer. But, in this case, the user state of the grid – sorted, selected row etc gets reset. So, is there a way I can auto-refresh my grid without replacing the dataprovider? Any suggestions? I know this isnt a discussion board so am not supposed to ask doubts here. But, you seem to be quite experienced in flex hence the question. please excuse.

    Regards,
    Uday

  2. Hi,

    Sorry to be off topic too. I was wondering what good resources were out there for Flex development. I currently want to find out how to embed an asset into my Flex application and display it in a datagrid when needed. I could go with the load call. But I don’t want to have to request that asset for each row in my datagrid. I kind of want to do something like linkage in Flash.

    Cheers

  3. Udayms, set the last selected index to a variable, launch a modal popup, refresh the grid, when the results come back, set the selectedindex to the variable you saved it to.

    private var lastSelected:Number;

function refresh()
{
   // your data call
   lastSelected = yourGrid.selectedIndex;
   PopUpManager.createPopUp ( this, SomeWindow, true);
}

function onYourDataServiceDone()
{
   removePopUp();
   yourGrid.selectedIndex = lastSelected;
}

    Tony, if you use the Embed metatag (or @Embed in the Image source), that’ll be a linkage. You can make a cellRenderer class, just like you do in Flash for the DataGrid. Then all rows will use the same asset.

    Both; try Flexcoders.

  5. Hi…. that scriptlet was really helpfull… and i have already subscribed to Flexcoders…. its a simply great mailing group… it has answers to almost all my questions.. i just have to search through the archives and bingo….! :) Thanx…

Comments are closed.