Flex中利用CheckBox对DataGrid控件中的项目进行过滤的例子

下面的例子展示了Flex中如何利用一个CheckBox控件以及ArrayCollection类的filterFunctio属性，对DataGrid控件中的项目进行过滤。

下面是具体的例子以及源代码：
<!--more-->

Download: main.mxml

1. <?xml version="1.0" encoding="utf-8"?>
2. <!-- http://blog.flexexamples.com/2008/03/12/using-a-combobox-to-filter-items-in-a-datagrid-in-flex/ -->
3. <mx:Applicationxmlns:mx="http://www.adobe.com/2006/mxml"
4. layout="vertical"
5. verticalAlign="middle"
6. backgroundColor="white">
8. <mx:Script>
9. <![CDATA[
10. importmx.controls.dataGridClasses.DataGridColumn;
12. privatefunction toggleFilter():void {
13. if(checkBox.selected) {
14. arrColl.filterFunction = processFilter;
15. }else {
16. arrColl.filterFunction = null;
17. }
18. arrColl.refresh();
19. }
21. privatefunction processFilter(item:Object):Boolean {
22. returnparseFloat(item.value) == 0;
23. }
25. privatefunction value_labelFunc(item:Object, col:DataGridColumn):String {
26. returnitem[col.dataField].toFixed(2);
27. }
28. ]]>
29. </mx:Script>
31. <mx:ArrayCollection id="arrColl">
32. <mx:source>
33. <mx:Array>
34. <mx:Object name="ColdFusion" value="0.00" />
35. <mx:Objectname="Dreamweaver" value="0.12" />
36. <mx:Object name="Fireworks" value="1.01" />
37. <mx:Objectname="Flash" value="0" />
38. <mx:Object name="Flash Player" value="-0.00" />
39. <mx:Objectname="Flex" value="0.00" />
40. <mx:Object name="Illustrator" value="2.92" />
41. <mx:Objectname="Lightroom" value="0.32" />
42. <mx:Object name="Photoshop" value="0.06" />
43. </mx:Array>
44. </mx:source>
45. </mx:ArrayCollection>
47. <mx:Panel status="{arrColl.length}/{arrColl.source.length}item(s)">
48. <mx:DataGrid id="dataGrid"
49. dataProvider="{arrColl}"
50. verticalScrollPolicy="on">
51. <mx:columns>
52. <mx:DataGridColumn dataField="name" />
53. <mx:DataGridColumn dataField="value"
54. labelFunction="value_labelFunc" />
55. </mx:columns>
56. </mx:DataGrid>
57. <mx:ControlBar>
58. <mx:CheckBox id="checkBox"
59. label="FilterDataGrid"
60. click="toggleFilter();" />
61. </mx:ControlBar>
62. </mx:Panel>
64. </mx:Application>

下面是执行实例（可以右键察看源代码）：

本文转自：http://elanso.com/ArticleModule/sourcearticle.aspx?idx=KAMbHlQwW6I5KeMGQcMGRRIi