对 Flex 数据网格中的列进行排序

Question

数据网格从后端数据库获取数据，该数据库具有类似的记录，

 RecordID           Division     Department      Date_Report_Submitted

1.                 Finance      Accounting        11/1/2010
2.                 Engineering  Design            4/2/2011
3.                 Engineering  Implementation    4/2/2011
4.                 Support      Chat_Support      2/4/2010

单击数据网格列（部门）中的标题会导致基于记录ID的排序，

Division     Department      Date_Report_Submitted

Finance      Accounting        11/1/2010
Engineering  Design            4/2/2011
Engineering  Implementation    4/2/2011
Support      Chat_Support      2/4/2010

而我希望它按数据网格列（部门）的字母顺序排序

Division     Department      Date_Report_Submitted

Finance      Accounting        11/1/2010
Support      Chat_Support      2/4/2010
Engineering  Design            4/2/2011
Engineering  Implementation    4/2/2011

，因为按照字典顺序，会计应位于 Chat_Support 之前。

查看http://blog.flexexamples.com/2008/04/09/creating-a-custom-sort-on-a-datagrid-control-in-flex/#more-590并有类似的

     <mx:DataGrid id="myRecords"  dataProvider="{myRecords_dp}" width="810" height="274"                         

itemClick="getRecordData(event)">
    <mx:columns>
        <mx:DataGridColumn id="firstCol" width="180" fontFamily="Arial" fontSize="12"
                           wordWrap="true" />
        <mx:Button label="Click to Sort" click="mysort()" />
    </mx:columns>
</mx:DataGrid>

错误，

private function mysort():void
{
   var sortField:SortField = new SortField();
   sortField.compareFunction = mycompare;
   sortField.descending = false;

   var sort:Sort = new Sort();
   sort.fields = [sortField];

   myRecords.sort = sort;
   myRecords.refresh();
}


                  private function mycompare(lhs:Object, rhs:Object):int
{
  var valueA:String = lhs.text();
  var valueB:String = rhs.text();
  return ObjectUtil.stringCompare(valueA, valueB);

}

如

1061: Call to a possible undefined methodfresh through a reference with static type mx.controls:DataGrid.
对于 myRecords.refresh(); 并

通过静态类型 mx.controls:DataGrid 的引用对可能未定义的属性进行排序。
对于 myRecords.sort

如有任何建议，我们将不胜感激。

Answer 1

你问题中的代码有点乱。例如，您不能将按钮用作 DataGrid 内的列。这会产生编译器错误。

尽管如此，我还是根据您的示例数据和您共享的代码整理了一个示例，以便向您展示 DataGrid 排序并不像您声称的那样工作。

在这里玩一下。

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:mx="library://ns.adobe.com/flex/mx"
               minWidth="955" minHeight="600" viewSourceURL="srcview/index.html">
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>

    <fx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
            [Bindable] 
            public var myRecords_dp : ArrayCollection = new ArrayCollection([
                {recordID:1, division:'Finance', department:'Accounting', Date_Report_Submitted:new Date(2010,11,1)},
                {recordID:2, division:'Engineering', department:'Design', Date_Report_Submitted:new Date(2010,4,2)},
                {recordID:3, division:'Engineering', department:'Implementation', Date_Report_Submitted:new Date(2011,4,2)},
                {recordID:4, division:'Support', department:'Chat_Support   ', Date_Report_Submitted:new Date(2010,2,4)},
            ])

            public function mysort():void{

            }

            public function getRecordData(event:Event):void{

            }
        ]]>
    </fx:Script>

    <mx:DataGrid id="myRecords"  dataProvider="{myRecords_dp}" width="810" height="274"                         
                 itemClick="getRecordData(event)"> 
        <mx:columns>
            <mx:DataGridColumn id="firstCol" width="180" fontFamily="Arial" fontSize="12"
                               wordWrap="true" dataField="division" />
            <mx:DataGridColumn id="secondCol" width="180" fontFamily="Arial" fontSize="12"
                               wordWrap="true" dataField="department" />
            <mx:DataGridColumn id="thirdCol" width="180" fontFamily="Arial" fontSize="12"
                               wordWrap="true" dataField="Date_Report_Submitted" />
<!--            <mx:Button label="Click to Sort" click="mysort()" />-->
        </mx:columns>
    </mx:DataGrid>


</s:Application>

为了获得有关您的问题的更多帮助；你将不得不分享一些真实的代码来演示一些问题；不是你在互联网上找到的不可编译的东西的大杂烩。

Answer 2

对于问题：

1061：通过引用调用可能未定义的方法刷新
具有静态类型 mx.controls:DataGrid。对于 myRecords.refresh();和

通过引用访问可能未定义的属性排序
静态类型 mx.controls:DataGrid。对于 myRecords.sort

尝试将 dataProvider 转换为 ArrayCollection 或 XMLListCollection （无论您使用哪个）：

    ArrayCollection(myRecords.dataProvider).sort = sort;
    ArrayCollection(myRecords.dataProvider).refresh();