Question

I’m building a Flex application using some custom components, which I think is messing things up. I’m trying to sortByColumn in a spark data grid, using the answer here as a template. When I try to use the following in a function,

myGrid.sortByColumns(0,true);

I get the error:

1061: Call to a possibly undefined method sortByColumns through a 
reference with static type com.components:MyReportGrid.

Anyone know how to remove this error? Is MyReportGrid somehow masking the correct location for the spark components? I also get “undefined method” errors when using some other functions, such as invalidateCell(), not sure if it’s related or not to this error.

My data grid looks like:

...
<components:MyReportGrid id="myGrid" dataProvider="{_myData}"...>
    <components:columns>
        <fx:Array>
            <supportClasses:MyColumn ... />
            <supportClasses:MyColumn ... />
            <supportClasses:MyColumn ... />
            ...

where MyColumn is a class as follows:

import spark.components.gridClasses.GridColumn;
public class MyColumn extends GridColumn
{
    ...
    public function MyColumn(headerText:String="header" width:Number=100 ...)
    {
       this.headerText=headerText;
       ...
    }
}

and MyReportGrid is:

<?xml version="1.0" encoding="utf-8"?>
<s:Group xmlns:fx="http://ns.adobe.com/mxml/2009"    
         xmlns:s="library://ns.adobe.com/flex/spark" 
         xmlns:mx="library://ns.adobe.com/flex/mx"
         width="400" height="300">
   import com.components.myClasses.MyColumn;
   import com.itemRenderers.myItemRenderer;
   import mx.collections.ArrayCollection;
   import mx.collections.ArrayList;
   import mx.collections.ListCollectionView;
   import spark.components.gridClasses.GridColumn;
   ...
   <s:DataGrid width="100%" ... />
</s:Group>

Answer 1

This will never work since your are calling myGrid.sortByColumns(0,true); on your MyReportGrid component which is of base type Group.

A Group does not have any method called sortByColumns

So you can either:

• Create a delegate method in your MyReportGrid component

  <?xml version="1.0" encoding="utf-8"?>
  <s:Group xmlns:fx="http://ns.adobe.com/mxml/2009"    
   xmlns:s="library://ns.adobe.com/flex/spark" 
   xmlns:mx="library://ns.adobe.com/flex/mx"
   width="400" height="300">
    import com.components.myClasses.MyColumn;
    import com.itemRenderers.myItemRenderer;
    import mx.collections.ArrayCollection;
    import mx.collections.ArrayList;
    import mx.collections.ListCollectionView;
    import spark.components.gridClasses.GridColumn;
    ...
  
     <mx:Script>
       <![CDATA[
       public function sortByColumns(columnIndices:Vector.<int>, isInteractive:Boolean = false):Boolean{
           return internalGroupGrid.sortByColumns(columnIndices,isInteractive);
       }
       ]]>
     </mx:Script>
  
     <s:DataGrid width="100%" id="internalGroupGrid"... />
  </s:Group>
  

• Make DataGrid the root tag of your MyReportGrid component

  <?xml version="1.0" encoding="utf-8"?>
  <s:DataGrid xmlns:fx="http://ns.adobe.com/mxml/2009"    
           xmlns:s="library://ns.adobe.com/flex/spark" 
           xmlns:mx="library://ns.adobe.com/flex/mx"
           width="400" height="300">
      import com.components.myClasses.MyColumn;
      import com.itemRenderers.myItemRenderer;
      import mx.collections.ArrayCollection;
      import mx.collections.ArrayList;
      import mx.collections.ListCollectionView;
      import spark.components.gridClasses.GridColumn;
      ...
  </s:DataGrid>