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

时间:2011-10-14 16:06:43

标签: flex actionscript

datagrid从后端数据库获取数据,后端数据库包含

等记录
 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

单击Datagrid列(Department)中的标题会导致基于recordID的排序,如

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

虽然我希望它按字母顺序为Datagrid列(Department)排序,如

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:通过静态类型mx.controls:DataGrid的引用调用可能未定义的方法刷新。
for myRecords.refresh(); 和

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

任何建议都将不胜感激。

2 个答案:

答案 0 :(得分:0)

你问题中的代码有点混乱。例如,您不能将按钮用作DataGrid中的列。这给出了编译器错误。

尽管如此,我根据您的示例数据和您共享的代码整理了一个示例,以便向您显示DataGrid排序不能按您声明的方式工作。

Play with it here

<?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>

为您的问题寻求更多帮助;你将不得不分享一些真实的代码来证明一些问题;不是你在互联网上找到的不可编译的东西。

答案 1 :(得分:0)

对于问题:

  

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

     

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

尝试将dataProvider转换为ArrayCollection或XMLListCollection(无论您使用哪个):

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