`

flex,datagrid 按照列来排序

    博客分类:
  • flex
阅读更多
排序部分
import mx.controls.DateField;
import mx.controls.advancedDataGridClasses.AdvancedDataGridColumn;
import mx.controls.dataGridClasses.DataGridColumn;
import mx.events.AdvancedDataGridEvent;
import mx.events.DataGridEvent;
import mx.utils.ObjectUtil;

/**
 * 点击dataGrid列头上的排序按钮
 */
public function dataGridSort(evt:DataGridEvent):void
{
	//1 得到要排序的列   
	var column:DataGridColumn=DataGridColumn(evt.currentTarget.columns[evt.columnIndex]);
	//2 得到列名   
	var columnName:String=column.dataField;
	//3 重写此列的排序函数   
	column.sortCompareFunction=function(obj1:Object, obj2:Object):int
	{
		return superSort(obj1, obj2, columnName);
	};
}

/**
 * 点击AdvancedDataGrid列头上的排序按钮
 */
private function advancedDataGridSort(evt:AdvancedDataGridEvent):void
{
	var column:AdvancedDataGridColumn=AdvancedDataGridColumn(evt.currentTarget.columns[evt.columnIndex]);
	var columnName:String=column.dataField;
	column.sortCompareFunction=function(obj1:Object, obj2:Object):int
	{
		return superSort(obj1, obj2, columnName);
	};
}

/**
 * 根据不同的数据类型选择不同的排序方式 优先级是数字、日期、字符串
 */
public function superSort(obj1:Object, obj2:Object, columnName:String):int
{
	//验证数据类型 Numbe Date String   
	if (!isNaN(obj1[columnName]))
	{
		return number_sortCompareFunc(obj1, obj2, columnName);
	}
	if (strIsDate(obj1[columnName]))
	{
		var inputFormat:String=getInputFormat(obj1[columnName]);
		return date_sortCompareFunc(obj1, obj2, columnName, inputFormat);
	}
	return string_sortCompareFunc(obj1, obj2, columnName);
}

/**
 * 日期的排序
 */
private function date_sortCompareFunc(obj1:Object, obj2:Object, columnName:String, inputFormat:String):int
{
	var date1:Date=DateField.stringToDate(obj1[columnName], inputFormat);
	var date2:Date=DateField.stringToDate(obj2[columnName], inputFormat);
	return ObjectUtil.dateCompare(date1, date2);
}

/**
 * 字符串的排序
 */
private function string_sortCompareFunc(obj1:Object, obj2:Object, columnName:String):int
{
//	var str1:String=obj1[columnName];
//	var str2:String=obj2[columnName];
	var str1:String=convertChar(obj1[columnName]);
	var str2:String=convertChar(obj2[columnName]);
	return ObjectUtil.stringCompare(str1, str2, false);
}

/**
 * 数字的排序
 */
private function number_sortCompareFunc(obj1:Object, obj2:Object, columnName:String):int
{
	var num1:Number=Number(obj1[columnName]);
	var num2:Number=Number(obj2[columnName]);
	return ObjectUtil.numericCompare(num1, num2);
}

/**
 * 验证一个字符串是否是日期格式
 */
private function strIsDate(str:String):Boolean
{
	var inputFormat:String=getInputFormat(str);
	//如果找不到日期表示符号则直接返回false   
	if (inputFormat == null)
	{
		return false;
	}
	var date:Date=DateField.stringToDate(str, inputFormat);
	//如果是日期date不为null   
	if (date != null)
	{
		return true;
	}
	else
	{
		return false;
	}
}

/**
 * 得到日期的格式  判断的顺序为 2012-03-17 2012/03/17 2012.03.17
 */
private function getInputFormat(str:String):String
{
	if (str.indexOf("-") != -1)
	{
		return "YYYY-MM-DD";
	}
	if (str.indexOf("/") != -1)
	{
		return "YYYY/MM/DD";
	}
	if (str.indexOf(".") != -1)
	{
		return "YYYY.MM.DD";
	}
	return null;
}

/**
 * 判断中文
 */
public function isIn(min:int, max:int, n:int):Boolean
{
	return min <= n && max >= n;
}

/**
 * 中文排序
 */
public function convertChar(chineseChar:String):String
{
	if (chineseChar != null)
	{
		var bytes:ByteArray=new ByteArray
		var str:String;
		for (var i:int=0; i < chineseChar.length; i++)
		{
			bytes.writeMultiByte(chineseChar.charAt(i), "cn-gb");
			var n:int=bytes[i] << 8;
			n+=bytes[i + 1];

			if (isIn(0xB0A1, 0xB0C4, n))
				str=str + "a";
			if (isIn(0XB0C5, 0XB2C0, n))
				str=str + "b";
			if (isIn(0xB2C1, 0xB4ED, n))
				str=str + "c";
			if (isIn(0xB4EE, 0xB6E9, n))
				str=str + "d";
			if (isIn(0xB6EA, 0xB7A1, n))
				str=str + "e";
			if (isIn(0xB7A2, 0xB8c0, n))
				str=str + "f";
			if (isIn(0xB8C1, 0xB9FD, n))
				str=str + "g";
			if (isIn(0xB9FE, 0xBBF6, n))
				str=str + "h";
			if (isIn(0xBBF7, 0xBFA5, n))
				return "j";
			if (isIn(0xBFA6, 0xC0AB, n))
				str=str + "k";
			if (isIn(0xC0AC, 0xC2E7, n))
				str=str + "l";
			if (isIn(0xC2E8, 0xC4C2, n))
				str=str + "m";
			if (isIn(0xC4C3, 0xC5B5, n))
				str=str + "n";
			if (isIn(0xC5B6, 0xC5BD, n))
				str=str + "o";
			if (isIn(0xC5BE, 0xC6D9, n))
				str=str + "p";
			if (isIn(0xC6DA, 0xC8BA, n))
				str=str + "q";
			if (isIn(0xC8BB, 0xC8F5, n))
				str=str + "r";
			if (isIn(0xC8F6, 0xCBF0, n))
				str=str + "s";
			if (isIn(0xCBFA, 0xCDD9, n))
				str=str + "t";
			if (isIn(0xCDDA, 0xCEF3, n))
				str=str + "w";
			if (isIn(0xCEF4, 0xD188, n))
				str=str + "x";
			if (isIn(0xD1B9, 0xD4D0, n))
				str=str + "y";
			if (isIn(0xD4D1, 0xD7F9, n))
				str=str + "z";

		}
		return str;
	}
	return null;
}



flex代码部分
<?xml version="1.0" encoding="utf-8"?>   
<!-- http://blog.flexexamples.com/2007/08/23/determining-a-datagridcolumn-objects-current-sort-order/ -->   
<mx:Application name="DataGridColumn_sortDescending_test"  
        xmlns:mx="http://www.adobe.com/2006/mxml"  
        layout="vertical"  
        verticalAlign="middle"  
        backgroundColor="white">   
    <mx:Script  source="SortUtil.as"/>   
    <mx:Script>   
        <![CDATA[   
            import mx.controls.DateField;   
            import mx.controls.advancedDataGridClasses.AdvancedDataGridColumn;   
            import mx.events.AdvancedDataGridEvent;   
            import mx.utils.ObjectUtil;   
            import mx.collections.ArrayCollection;   
            import mx.controls.dataGridClasses.DataGridColumn;   
            import mx.events.DataGridEvent;
            [Bindable]   
            public var ac:ArrayCollection=new ArrayCollection([   
            {data:"-1112",label:"ad",date:"2009/11/10",china:"啊"},   
            {data:"112",label:"a",date:"2009/11/11",china:"吧"},   
            {data:"1",label:"12b",date:"2009/11/01",china:"才"},   
            {data:"2",label:"Ass",date:"2009/11/20",china:"的"},   
            {data:"0",label:"ass",date:"2009/11/14",china:"饿"},   
            {data:"3",label:"csx",date:"2010/11/12",china:"飞"},   
            {data:"1232",label:"cdf",date:"2009/11/13",china:"个"},   
            {data:"4",label:"xzm",date:"2001/12/10",china:"好"},   
            {data:"345",label:"awq",date:"2009/01/10",china:"在"} ,
            {data:"345",label:"awq",date:"2009/01/10",china:"a"}   ,
            {data:"345",label:"awq",date:"2009/01/10",china:"j"}  
            ]);
        ]]>   
    </mx:Script>   
    <mx:DataGrid id="dataGrid"  
            rowCount="10" dataProvider="{ac}"  
            headerRelease="dataGridSort(event)" width="600">   
        <mx:columns>   
            <mx:DataGridColumn  dataField="data"  headerText="数字"/>   
            <mx:DataGridColumn  dataField="date"  headerText="日期"/>   
            <mx:DataGridColumn  dataField="china"  headerText="中文"/>   
        </mx:columns>   
    </mx:DataGrid>    
</mx:Application>  
分享到:
评论

相关推荐

    flex datagrid 前台 分页

    Flex DataGrid支持自定义数据提供者,你可以创建一个类来实现IList接口,这个类应该包含分页逻辑,如当前页、总页数、每页记录数等属性。当用户点击分页按钮时,你的数据提供者会更新这些属性,并根据新的分页设置...

    flex DataGrid中文字符排序类

    4. **应用排序**:将排序后的结果应用于DataGrid,即可按照中文名称的自然顺序显示。 #### 总结 `SortUtil`类为解决Flex DataGrid中的中文字符排序问题提供了一种实用的方法。通过对关键常量和`CHAR_LIB`数组的...

    Flex Datagrid checkbox实现

    Flex Datagrid提供了许多高级特性,如排序、过滤、分页等,可以通过自定义列样式、数据提供程序和事件处理来实现。此外,还可以通过使用ItemEditor实现单元格编辑,或者通过使用AdvancedDataGrid组件来处理更复杂的...

    flex DataGrid 表头分组

    总的来说,Flex DataGrid的表头分组功能增强了数据展示的可读性和交互性,是处理复杂数据集时非常有用的工具。通过合理配置数据源、定义数据提供者、设置分组字段以及定制样式,我们可以创建出高效且直观的数据网格...

    Flex dataGrid 全选、反选

    本文将详细讨论如何在Flex DataGrid中实现全选和反选功能,并结合`checkBox`来优化这一过程。 首先,我们要理解DataGrid的结构。DataGrid由多个列组成,每一列可能包含不同类型的控件,如文本、图像或复选框。在...

    flex datagrid 嵌套checkbox实现全选

    DataGrid支持排序、分页、筛选等功能,是UI设计中处理大量数据的首选组件。 2. **嵌套复选框(Checkbox)**: 在DataGrid的每个单元格内嵌入复选框,可以为用户提供多选操作的界面。通过监听复选框的事件,可以...

    Flex dataGrid 自定义显示列

    总的来说,Flex DataGrid的自定义显示列是通过灵活的列配置、自定义渲染器以及数据绑定来实现的。开发者可以根据业务需求,通过调整这些参数来创建高度定制化的数据展示界面,提高应用的用户体验。对于深入学习Flex...

    flex datagrid

    虽然标题是“flex datagrid”,但这个文件可能展示了如何结合使用DataGrid和Tree来呈现不同类型的数据。 5. **dataGridEvent.mxml**:此文件可能涉及DataGrid的事件处理,例如排序事件(sort)、选择事件...

    flex datagrid按数字顺序,字母顺序排序

    在Flex中,我们可以通过监听DataGrid的headerRelease事件来实现排序。当用户点击列头时,这个事件会被触发。在事件处理函数中,我们可以获取到被点击的列(GridColumn),然后根据该列的dataField属性对数据提供者...

    flex DataGrid xml 动态数据列表实例

    3. **创建`DataGrid`**:在Flex中,我们先创建一个`DataGrid`实例,并设置其相关属性,如列的宽度和是否可排序等。 4. **绑定数据**:将解析后的XML数据绑定到`DataGrid`。这通常通过`dataProvider`属性完成。`data...

    将Flex DataGrid数据导出到Excel中

    在Flex客户端,你需要遍历DataGrid的所有行和列,收集其显示的数据。你可以通过遍历DataGrid的items属性来获取所有数据项,然后访问每个item的children来获取单元格值。记得只提取可见的和有数据的单元格,因为...

    flex datagrid 表格 合计

    1. **DataGrid组件**:DataGrid是Flex中用于展示结构化数据的组件,它可以显示多列数据,并支持排序、选择和编辑等功能。在创建DataGrid时,我们需要指定数据源(通常是ArrayCollection或XMLListCollection)。 2. ...

    Flex DataGrid CheckBox 一个简单的全选

    在Flex开发中,DataGrid组件是一个非常常用的控件,它用于展示数据集合,并提供交互式操作,如排序、选择等。本示例聚焦于DataGrid中的CheckBox集成,特别是实现一个全选的功能。以下是对这个主题的详细解释: 一、...

    FLEX datagrid应用实例

    6. 图像显示:在DataGrid中展示图像,例如员工照片,可以通过定义自定义列和嵌入图像组件来实现。 四、Flex DataGrid的高级特性 除了基础功能,DataGrid还支持以下高级特性: 1. 拖放排序:允许用户通过拖动行来...

    Flex中如何创建自定义排序DataGrid控件的例子

    在Flex开发中,DataGrid控件是用于展示数据集的常用组件,它可以显示表格形式的数据并支持用户交互,如排序、选择和编辑。然而,有时我们可能需要对DataGrid的默认排序功能进行自定义,以满足特定的业务需求。本教程...

    flex datagrid插入多列Checkbox应用实例

    在Flex开发中,数据网格(DataGrid)是用于展示大量结构化数据的组件,它可以提供丰富的功能,如排序、分页、编辑等。在实际应用中,我们有时需要在DataGrid的每一行中插入多个复选框(Checkbox),以便用户能够进行...

    flex Datagrid checkbox全选

    总结起来,实现Flex Datagrid checkbox全选功能主要涉及自定义数据列、表头渲染器和行渲染器,通过事件监听和状态同步来达到全选的效果。在实际应用中,可能还需要处理部分选中、反选等复杂逻辑,但上述步骤提供了一...

    FLEX的一个DataGrid例子

    DataGrid的列可以通过`mx:DataGridColumn`子元素来定义。每列可以设置标题、数据字段、宽度、是否可编辑等属性。例如: ```xml 姓名" dataField="name"/&gt; 年龄" dataField="age"/&gt; ``` 3. **数据绑定**: ...

Global site tag (gtag.js) - Google Analytics