<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
    xmlns:s="library://ns.adobe.com/flex/spark" 
    xmlns:mx="library://ns.adobe.com/flex/mx" 
    initialize="init();">

    <fx:Script>
    <![CDATA[
        import mx.collections.ArrayCollection;

        import spark.events.TextOperationEvent;

        [Bindable]
        private var dataProvider:ArrayCollection;

        private var filterString:String;

        private function init():void
        {
            dataProvider = new ArrayCollection(
                [
                    { name: "Alan", surname: "Cooper" },
                    { name: "James", surname: "Gosling" },
                    { name: "Mike", surname: "Chambers" },
                    { name: "Hare", surname: "Krishna" },
                    { name: "Otto", surname: "Thunder" }
                ]);
            dataProvider.filterFunction = filterFunction;
        }   

        private function filterFunction(item:Object):Boolean
        {
            if (!filterString)
                return true;

            for (var p:String in item)
            {
                var string:String = item[p] as String;
                if (!string)
                    continue;

                if (string.toLocaleLowerCase().indexOf(filterString) >= 0)
                    return true;
            }
            return false;
        }

        private function input_changeHandler(event:TextOperationEvent):void
        {
            filterString = input.text.toLocaleLowerCase();
            dataProvider.refresh();
        }

    ]]>
    </fx:Script>

    <s:layout>
        <s:VerticalLayout horizontalAlign="center" verticalAlign="middle"/>
    </s:layout>

    <s:TextInput id="input" change="input_changeHandler(event)"/>

    <mx:DataGrid dataProvider="{dataProvider}"/>

</s:Application>