Flex - ArrayCollection - Agregar y eliminar una función de filtro

Question

Estoy usando Adobe Flash Builder 4 Premium. tengo un mx:DataGrid y un s:TextInput, y estoy tratando de configurar un cuadro de búsqueda que filtra el DataGrid en cada tecla Presione.

Esta página muestra un ejemplo casi perfecto de lo que estoy tratando de hacer, excepto que estoy estableciendo esto en un s:TitleWindow, que se menciona como una ventana emergente usando el popupManager. La lista que estoy tratando de filtrar puede ser muy grande. Es una lista de nombres de usuario, obtenidos de una base de datos MySQL a través de PHP. Como puede ser tan grande, quiero que la lista se complete una vez en la aplicación principal y luego se hace referencia en la ventana emergente para que no tenga que obtener todos los nombres de usuario cada vez que el usuario abre la ventana emergente.

Tengo todo esto funcionando bien por primera vez que mencionas la ventana emergente, pero si lo cierras y lo vuelve a mencionar, obtengo este error de tiempo de ejecución:

También recibo este error si intento establecer el filterFunction De vuelta a Null justo antes de cerrar la ventana emergente.

Ver código de muestra a continuación:

Aplicación principal:

<?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">
    <fx:Script>
        <![CDATA[
            import mx.collections.*;
            import mx.managers.PopUpManager;

            [Bindable] public var allMembersList:ArrayCollection;

            private function openPopup():void
            {
                var popupInstance:popup = PopUpManager.createPopUp(this as DisplayObject, popup, true) as popup;
                PopUpManager.centerPopUp(popupInstance);
            }
        ]]>
    </fx:Script>
    <s:Button label="Open Popup" click="openPopup()"/>
</s:Application>

Surgir:

<?xml version="1.0" encoding="utf-8"?>
<s:TitleWindow xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark" 
               xmlns:mx="library://ns.adobe.com/flex/mx"
               xmlns:model="services.model.*"
               tabChildren="false"
               close="close()">
    <fx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
            import mx.core.FlexGlobals;
            import mx.managers.PopUpManager;

            private function getUsers(startsWith:String = ""):void
            {
                if (FlexGlobals.topLevelApplication.allMembersList == null)
                {
                    FlexGlobals.topLevelApplication.allMembersList = new ArrayCollection();
                    getUsersResult.token = php.getUsers();
                }

                FlexGlobals.topLevelApplication.allMembersList.filterFunction = function(item:Object):Boolean
                {
                    return item.username.match(new RegExp("^"+ startsWith, "i"));
                };
                FlexGlobals.topLevelApplication.allMembersList.refresh();
                grdMemberList.dataProvider = FlexGlobals.topLevelApplication.allMembersList;
            }

            private function getUsersResultHandler():void
            {
                var users:Object = getUsersResult.lastResult;
                for each (var user:Object in users)
                    FlexGlobals.topLevelApplication.allMembersList.addItem({"username":user.username});
            }

            private function close():void
            {
                FlexGlobals.topLevelApplication.allMembersList.filterFunction = null;
                FlexGlobals.topLevelApplication.allMembersList.refresh();
                PopUpManager.removePopUp(this);
            }
        ]]>
    </fx:Script>
    <fx:Declarations>
        <model:MODEL id="php" fault="{Alert.show('There was a PHP error!\nPlease note the steps taken to produce this error and call support.\n\nError Message: '+ event.fault.faultDetail, 'Error');}" showBusyCursor="false"/>
        <s:CallResponder id="getUsersResult" result="getUsersResultHandler()"/>
    </fx:Declarations>

    <mx:DataGrid id="grdMemberList" creationComplete="getUsers()">
        <mx:columns>
            <mx:DataGridColumn headerText="Member List" dataField="username"/>
        </mx:columns>
    </mx:DataGrid>
    <s:TextInput id="txtUsername" keyUp="{ if (event.charCode != 13 && event.charCode != 0) getUsers(txtUsername.text); }"/>
</s:TitleWindow>

La aplicación todavía parece funcionar como se esperaba, a pesar del error, pero no soy fanático de tener errores en mi aplicación, por lo que realmente me gustaría descubrir qué está causando este problema.

¡Gracias!

Answer 1

Resulta que el problema fue con el tabChildren propiedad. La documentación dice que no use esta propiedad en Flex, sino para usar hasFocusableChildren en cambio. No estoy seguro de por qué este problema solo se mostró una vez que intenté establecer el filterFunction.

La razón por la que estaba configurando tabChildren Para falso era para que la funcionalidad de tecla TAB predeterminada (enfoque de conmutación) no tenga lugar, para que pueda controlar ese comportamiento yo mismo. los hasFocusableChildren La propiedad no funciona (o al menos, configurarlo en falso no impide que la tecla de tabulación cambie de enfoque), por lo que es posible que necesite probar otro medio para capturar el evento de la clave TAB y detenerlo.

---

EDITAR:

Para cualquiera que esté interesado (aunque realmente no tenga nada que ver con la publicación original), la solución era cambiar:

<s:TitleWindow xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:mx="library://ns.adobe.com/flex/mx"
               xmlns:model="services.model.*"
               width="1000"
               height="550"
               tabChildren="false"
               close="close()">

a:

<s:TitleWindow xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:mx="library://ns.adobe.com/flex/mx"
               xmlns:model="services.model.*"
               width="1000"
               height="550"
               keyFocusChange="{ event.preventDefault(); }"
               close="close()">

Answer 2

Nunca intento probar su código (porque también necesita el lado del servidor), pero creo que no debe configurar FilterFunction nuevamente en NULL. Alternativamente, podría establecerlo en una función que siempre devuelva verdadera.

function defaultFilterFunc( item: Object ): Boolean { return true; }