读书人

flex datagrid应用arraycollection中的

发布时间: 2012-11-10 10:48:50 作者: rapoo

flex datagrid使用arraycollection中的filterFunction属性进行过滤
FilterControl.as

package
{
import mx.collections.ArrayCollection;
import mx.core.Application;
import mx.controls.TextInput;
import mx.controls.Button;
import mx.controls.ComboBox;

public class FilterControl extends Application
{
[Bindable] public var dpColumns:ArrayCollection;
[Bindable] public var dpRows:ArrayCollection;

public var keyword:TextInput;
public var btnFilter:Button;
public var cmbCol:ComboBox;

public function FilterControl()
{
}

public function init():void
{
dpColumns = new ArrayCollection();
dpColumns.addItem({data:'any', label:'Any'});
dpColumns.addItem({data:'type', label:'Type'});
dpColumns.addItem({data:'name', label:'Name'});
dpColumns.addItem({data:'url', label:'URL'});
dpColumns.addItem({data:'desc', label:'Descriptiom'});
dpColumns.addItem({data:'tags', label:'Tags'});

dpRows = new ArrayCollection();
var item:Object = new Object();
item.type = "Website";
item.name = "Expectal.com";
item.url = "http://www.expectal.com";
item.desc = "Your Professional Flash Photo Gallery with Slideshow and Background Music";
item.tags = "Flash, Gallery, Slideshow, Music";
dpRows.addItem(item);

item = new Object();
item.type = "Website";
item.name = "Franto.com Blog";
item.url = "http://blog.franto.com";
item.desc = "Your Professional Flash Photo Gallery with Slideshow and Background Music";
item.tags = "Flash, Flex, AIR, Tutorial";
dpRows.addItem(item);

item = new Object();
item.type = "Tutorial";
item.name = "FlexSpy - Flex/AIR inspector";
item.url = "http://www.franto.com/blog2/flexspy-inspector-in-your-flexair-application";
item.desc = "FlexSpy - Kind of what Firebug does for HTML/Ajax applications but for Flex 2.0/3.0 applications.";
item.tags = "Flex, AIR, Tutorial";
dpRows.addItem(item);

item = new Object();
item.type = "Tutorial";
item.name = "Quick Outline in FlexBuilder - Ctrl+O";
item.url = "http://www.franto.com/blog2/quick-outline-in-flexbuilder-ctrlo";
item.desc = "Speed up your development with Quick Outline in FlexBuilder";
item.tags = "Flex, AIR, Tutorial";
dpRows.addItem(item);

item = new Object();
item.type = "Tutorial";
item.name = "Custom header in DataGrid";
item.url = "http://www.franto.com/blog2/custom-header-in-datagrid";
item.desc = "Custom header in DataGrid";
item.tags = "Flex, AIR, Tutorial";
dpRows.addItem(item);

item = new Object();
item.type = "Tutorial";
item.name = "Custom header in DataGrid 2";
item.url = "http://www.franto.com/blog2/custom-header-in-datagrid-part-2";
item.desc = "Custom header in DataGrid - part 2";
item.tags = "Flex, AIR, Tutorial";
dpRows.addItem(item);

item = new Object();
item.type = "Tutorial";
item.name = "Quick Outline in FlexBuilder - Ctrl+O";
item.url = "http://www.franto.com/blog2/quick-outline-in-flexbuilder-ctrlo";
item.desc = "Speed up your development with Quick Outline in FlexBuilder";
item.tags = "Flex, AIR, Tutorial";
dpRows.addItem(item);


}

public function resetFilter():void
{
keyword.text = "";
filterResults();
}
public function filterResults():void
{
dpRows.filterFunction = _sortRows;
dpRows.refresh();
}

private function _sortRows(item:Object):Boolean
{
var col:String = cmbCol.selectedItem.data as String;
var key:String = keyword.text;

key = key.toLowerCase();

if (key != "")
{
if (col != "any")
{
var value:String = item[col];
value = value.toLowerCase();

if (value.indexOf(key) >= 0)
{
return true;
}
} else {
for (var o:String in item)
{
value = item[o];
value = value.toLowerCase();
if (value.indexOf(key) >= 0)
{
return true;
}
}
}
} else {
return true;
}

return false;
}
}
}



FilterFunction.mxml

<?xml version="1.0" encoding="utf-8"?><FilterControl xmlns:mx="http://www.adobe.com/2006/mxml"    xmlns="*"     layout="vertical" applicationComplete="init()">        <mx:Style source="default.css"/>        <mx:HBox width="100%">        <mx:Label text="Filter:"/>        <mx:TextInput id="keyword" width="100%"/>        <mx:ComboBox id="cmbCol" dataProvider="{dpColumns}"/>    </mx:HBox>    <mx:HBox width="100%" horizontalAlign="right">        <mx:Button label="Filter" id="btnFilter" click="filterResults()" width="150"/>        <mx:Button label="Reset" click="resetFilter()" width="150"/>    </mx:HBox>    <mx:DataGrid width="100%" height="100%" dataProvider="{dpRows}" variableRowHeight="true">        <mx:columns>            <mx:DataGridColumn dataField="type" headerText="Type" width="80"/>            <mx:DataGridColumn dataField="name" headerText="Name" width="180"/>            <mx:DataGridColumn dataField="url" headerText="URL"/>            <mx:DataGridColumn dataField="desc" headerText="Description"/>            <mx:DataGridColumn dataField="tags" headerText="Tags" width="200"/>        </mx:columns>    </mx:DataGrid>    </FilterControl>/code] 

读书人网 >flex

热点推荐