当我们组织条件查询数据的时候,一般需要重新访问数据库,但有些时候因为数据量比较大,或者只是对已经存在的数据进行过滤显示时,筛选的过程就自然放在前端界面了。Flex作为强大界面展示,自然也可以做到这一点。以ArrayCollection为例,当数据源始ArrayCollection时,我们可以利用ArrayCollection的filterFunction成功实现对数据源的过滤显示。例子代码如下:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
verticalAlign="middle">
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
[Bindable]
private var arr:ArrayCollection = new ArrayCollection([{useName:"natian",team:"ShenLong"},
{useName:"bryant",team:"Lakers"},
{useName:"paul",team:"Vespid"},
{useName:"yaoming",team:"Bees"}]);
private function inputChange():void {
arr.filterFunction = arrFilterFunction;
arr.refresh();
}
private function arrFilterFunction(item:Object):Boolean {
var seachSrc:String = input.text.toLowerCase();
var itemSrc:String = ((item.useName) as String).toLowerCase();
return itemSrc.indexOf(seachSrc) > -1;
}
]]>
</mx:Script>
<mx:TextInput id="input" change="inputChange()"/>
<mx:DataGrid dataProvider="{arr}" height="82">
<mx:columns>
<mx:DataGridColumn headerText="姓名" dataField="useName"/>
<mx:DataGridColumn headerText="球队" dataField="team"/>
</mx:columns>
</mx:DataGrid>
</mx:Application>
效果如图: