DataGrid自身的排序组件可谓做的非常全面,而且非常好用。用户也可以自己实现排序算法。但有时我们需要实现一些额外的功能,如要实现数据库排序。就是当我点击某一列时,我希望实现数据库根据我的条件排序。实现排序这个功能并不难,只需要实现DataGridEvent.HEADER_RELEASE的Listener即可,但要实现排序箭头的存在可能就需要费一番周折。 这里我提供三种方法 1)复写header 类,把箭头(sortArrow)去掉。同时自己整两个图片放在那里,手工控制一下。这个思路没有实现过,据说可能; 2)复写DataGrid的dataProvider方法。对传入的值进行排序,这样就会出现箭头。如下面的实现步骤:
(1)实现对 dataProvider 的复写
/**
* override current dataProvider to call refresh column
*/
[Inspectable(category="Data", defaultValue="undefined")]
override public function set dataProvider(value:Object):void
{
super.dataProvider=value;
checkorderArrow();
} (2)实现上面调用的方法: /**
* order current column,purpose to show Arrow,
* note: not used function
*/
public function checkorderArrow():void{
if(dataProvider&¤tsortColumn){
var coll:ArrayCollection=dataProvider as ArrayCollection;
coll.sort = new Sort();
var field:SortField=new SortField(currentsortColumn.dataField, true, currentsortColumn.sortDescending);
if(currentsortColumn.isNumberic){
field.compareFunction=sortFunction;
}
coll.sort.fields = [field];
coll.refresh();
mx_internal::sortDirection=currentsortColumn.sortDescending;
}
}
注:这个方法中用到了currentsortColumn,这个是要在headerRelease时需要记住的列。
3)第三种方法和第二种方法不同的地方是在排序的实现上,如以下的代码:
/**
* @private
* sort current column ,its code is from datagrid
*/
private function sortByColumn():void
{
if(!currentsortColumn){
return;
}
var c:SessionDataGridColumn = currentsortColumn;
var desc:Boolean = c.sortDescending;
// do the sort if we're allowed to
if (c.sortable)
{
var s:Sort = collection.sort;
var f:SortField;
if (s)
{
s.compareFunction = null;
// analyze the current sort to see what we've been given
var sf:Array = s.fields;
if (sf)
{
for (var i:int = 0; i < sf.length; i++)
{
if (sf[i].name == c.dataField)
{
// we're part of the current sort
f = sf[i]
// flip the logic so desc is new desired order
desc = !f.descending;
break;
}
}
}
}
else
s = new Sort;
if (!f)
f = new SortField(c.dataField);
c.sortDescending = desc;
var dir:String = (desc) ? "DESC" : "ASC";
sortDirection = dir;
// set the grid's sortIndex
lastSortIndex = sortIndex;
sortIndex = point[1];
// if you have a labelFunction you must supply a sortCompareFunction
f.name = c.dataField;
if (c.sortCompareFunction != null)
{
f.compareFunction = c.sortCompareFunction;
}
else
{
f.compareFunction = null;
}
f.descending = desc;
s.fields = [f];
}
collection.sort = s;
collection.refresh();
}
上面这两种方法说的都不是特别细。以下是整个类的代码(第二种和第三种的实现)供参考:
package {
import mx.collections.ArrayCollection;
import mx.collections.Sort;
import mx.collections.SortField;
import mx.controls.DataGrid;
import mx.controls.dataGridClasses.DataGridColumn;
import mx.core.mx_internal;
import mx.events.DataGridEvent;
import mx.utils.ObjectUtil;
/**
* added a cutomer datagrid for database sorting
*/
public class SortDatabaseDatagrid extends DataGrid
{
use namespace mx_internal;
public function SortDatabaseDatagrid()
{
super();
this.addEventListener(DataGridEvent.HEADER_RELEASE,function(evt:DataGridEvent):void{
evt.currentTarget.currentsortColumn=DataGridColumn(evt.currentTarget.columns[evt.columnIndex]);
point[0]=evt.rowIndex;
point[1]=evt.columnIndex;
});
}
private var point:Array=[];
//remember current clicking column
private var _currentsortColumn:SessionDataGridColumn;
public function get currentsortColumn():SessionDataGridColumn
{
return _currentsortColumn;
}
public function set currentsortColumn(value:SessionDataGridColumn):void
{
_currentsortColumn = value;
}
/**
* order current column,purpose to show Arrow,
* note: not used function
*/
public function checkorderArrow():void{
if(dataProvider&¤tsortColumn){
var coll:ArrayCollection=dataProvider as ArrayCollection;
coll.sort = new Sort();
var field:SortField=new SortField(currentsortColumn.dataField, true, currentsortColumn.sortDescending);
if(currentsortColumn.isNumberic){
field.compareFunction=sortFunction;
}
coll.sort.fields = [field];
coll.refresh();
mx_internal::sortDirection=currentsortColumn.sortDescending;
}
}
/**
* @private
* sort current column ,its code is from datagrid
*/
private function sortByColumn():void
{
if(!currentsortColumn){
return;
}
var c:SessionDataGridColumn = currentsortColumn;
var desc:Boolean = c.sortDescending;
// do the sort if we're allowed to
if (c.sortable)
{
var s:Sort = collection.sort;
var f:SortField;
if (s)
{
s.compareFunction = null;
// analyze the current sort to see what we've been given
var sf:Array = s.fields;
if (sf)
{
for (var i:int = 0; i < sf.length; i++)
{
if (sf[i].name == c.dataField)
{
// we're part of the current sort
f = sf[i]
// flip the logic so desc is new desired order
desc = !f.descending;
break;
}
}
}
}
else
s = new Sort;
if (!f)
f = new SortField(c.dataField);
c.sortDescending = desc;
var dir:String = (desc) ? "DESC" : "ASC";
sortDirection = dir;
// set the grid's sortIndex
lastSortIndex = sortIndex;
sortIndex = point[1];
// if you have a labelFunction you must supply a sortCompareFunction
f.name = c.dataField;
if (c.sortCompareFunction != null)
{
f.compareFunction = c.sortCompareFunction;
}
else
{
f.compareFunction = null;
}
f.descending = desc;
s.fields = [f];
}
collection.sort = s;
collection.refresh();
}
}
}
分享到:
相关推荐
在本文中,我们将深入探讨基于Adobe Flex的DataGrid组件的应用实例。Flex是一种强大的富互联网应用程序(RIA)开发框架,主要用于构建交互式、响应式的Web应用。DataGrid是Flex中的一个核心组件,它允许开发者以表格...
Flex DataGrid是一款强大的数据展示组件,常用于Adobe Flex或Flash Builder等开发环境中。它能够高效地展示大量数据,并提供丰富的用户交互功能。在本场景中,我们关注的是“前台分页”这一技术。 前台分页是指在...
在Flex应用中,Datagrid经常被用于处理和展示大量的结构化数据。在标题“Flex Datagrid checkbox实现”中,讨论的核心是Datagrid中集成复选框(checkbox)的功能。 在Flex Datagrid中实现复选框功能,主要是通过...
在提供的文档《Flex_AdvancedDataGrid的使用.doc》中,可能包含了更多关于如何使用和配置`AdvancedDataGrid`以实现表头分组的详细信息,包括示例代码和最佳实践。建议详细阅读文档以深入理解和应用这个功能。 总的...
在Flex编程中,DataGrid组件是用于展示结构化数据的强大工具。它允许用户对数据进行排序、筛选和编辑。在实际应用中,我们经常需要实现全选和反选功能,以便用户可以一次性选择或取消选择所有条目。本文将详细讨论...
在Flex开发中,数据网格(DataGrid)是用于展示数据集合的强大组件,它允许用户以表格形式查看和操作数据。本示例关注的是在DataGrid中嵌套复选框(Checkbox),并实现全选功能。这在需要用户批量选择或操作数据的...
Flex DataGrid是一个强大的数据展示组件,它在Adobe Flex框架中被广泛使用,用于显示和操作大量结构化的数据。这个组件提供了灵活的布局选项,可定制的列格式化,以及丰富的用户交互功能,如排序、筛选和编辑。...
Flex DataGrid 是 Adobe Flex 框架中的一个组件,它用于在应用程序中显示表格数据。在Flex中,实现数据网格的总计功能是一项常见的需求,它能够帮助用户快速地理解和分析大量数据。本项目提供了一个已经实现了总计...
flex datagrid 实现合计功能控件包 带源码,demo fxp是flex4的工程文件,导入到工作空间即可 直接导入项目即可。 更多访问我的blog www.dplayer.net
`DataGrid`组件是Flex提供的一种强大的工具,用于显示表格形式的数据。在这个实例中,我们将探讨如何利用Flex的`DataGrid`组件结合XML文件来实现动态数据列表。 首先,让我们深入了解`DataGrid`组件。`DataGrid`是...
在开发基于Adobe Flex的应用程序时,我们经常遇到需要将数据展示在用户友好的方式中,例如使用DataGrid组件。然而,有时用户希望将这些数据显示在更传统的格式中,如Microsoft Excel电子表格。本教程将详细介绍如何...
本文将深入探讨如何在Flex的Datagrid中实现数据的合计与平均值计算,帮助开发者更好地理解和应用这些功能。 首先,我们要了解Flex的Datagrid组件的基本结构。Datagrid通常与数据提供者绑定,如ArrayCollection或...
在Flex开发中,DataGrid组件是一个非常常用的控件,它用于展示数据集合,并提供交互式操作,如排序、选择等。本示例聚焦于DataGrid中的CheckBox集成,...同时,了解和掌握这些技巧对于提高Flex应用的用户体验至关重要。
在Flex开发中,DataGrid控件是用于展示数据表格的常用组件,它可以高效地呈现大量结构化信息。在某些情况下,我们可能需要根据特定条件改变DataGrid中的某一行或几行的背景颜色,以突出显示或者区分不同的数据状态。...
通过阅读博客文章,我们可以深入了解Flex DataGrid分页的实现细节,学习如何利用PagerBar.mxml或其他工具来优化我们的Flex应用。同时,也可以从中获取灵感,为自己的项目设计更高效、更易用的分页解决方案。
Flex DataGrid是一款基于Adobe Flex技术的数据展示控件,它允许开发者在Web应用中展示大量数据并进行高效管理。在描述中提到的“flex datagrid pagination”是指DataGrid控件的一个重要特性——分页功能。在处理大...
在Flex中,可以为DataGrid定义一个CSS类,然后在需要改变背景色的行上应用这个类。例如: ```css .myCustomRow { background-color: #FF0000; } ``` 然后在数据源中为特定行添加这个类名,或者在代码中动态设置:...
压缩包中的`FlexClient1.1`可能是一个包含Flex客户端应用程序的项目,而`FlexServer1.1`可能是服务器端的组件或者服务,如处理DataGrid双击事件后发送的请求。在实际应用中,客户端与服务器端的交互通常通过AMF...