1 Reply Latest reply on Dec 27, 2007 5:30 AM by m_hartnett

    Add multiple filterFunctions to an ArrayCollection

    pabera Level 1
      Hello,

      I am filling an ArrayCollection over a HTTPRequest, like this...,
      quote:

      [Bindable]
      private var content:ArrayCollection = new ArrayCollection();
      private function contentRPCResult(event:ResultEvent):void {
      content = event.result.allEntries.entry;
      }

      that works fine.
      the data contains a "category id" besides other information. via a dropdown menue, I can select different categories in order to show a selection of the the amount of data. I did it like this..
      quote:

      private function filterKat():void {
      content.filterFunction = searchKat;
      content.refresh();
      }

      private function searchKat(item:Object):Boolean{
      // show all data of the collection
      if(katsSelectedItem.id == 0)
      return true;
      else
      return (item.kat_id == katsSelectedItem.id);
      }

      .. which works out great as well.

      but now I'd like to set up a TextInput next to the drop down where people can type words. the xml data has to be filtered by the typed in word. if I separate these two filter functions and use it on its own, it works. but i want it like this.
      for example. the user types in a keyword. the data is filtered and the datagrid only shows the filtered data. then the user selects a category. the data that has been filtered already should now be filtered again. hope you understand what I like to describe.

      Is there a possibility to filter an ArrayCollection by multiple filterfunctions at the same time, and if yes... how?

      Hope somebody can help me.
      Greets, pat
        • 1. Add multiple filterFunctions to an ArrayCollection
          m_hartnett Level 3
          I am not sure if this is what you are looking to do but here is some code for combining filter criteria.


          If you look at this code you can see that we use multiple dropdowns to filter data. This is just a canvas with 3 dropdown lists and a button to initiate the filtering.

          This code will not compile because it is missing some references to other objects.
          But if you follow the code through from the click of the button and you will see how it combines the filter criteria.


          <?xml version="1.0" encoding="utf-8"?>
          <mx:Canvas xmlns:mx=" http://www.adobe.com/2006/mxml"
          xmlns:view="com.febatmon.view.*"
          xmlns:base="com.febatmon.view.base.*"
          xmlns:viewUtil="com.febatmon.view.util.*"
          xmlns="*"
          width="100%"
          height="36"
          styleName="stdFilterContainer">

          <mx:Script>
          <![CDATA[

          import mx.managers.PopUpManager;
          import mx.core.IFlexDisplayObject;

          //THIS GETS CALLED FROM THE CLICK OF THE BUTTON
          public function filterData( e : Event ) : void {
          this.resetAC();
          //THIS IS THE NAME OF THE FUNCTION THAT WILL DO THE FILTERING .... IT IS DOWN BELOW
          yourArrayCollection.filterFunction=stateFilterFunc;

          //THIS WILL CAUSE IT TO REFRESH ITS FILTERED DATA
          yourArrayCollection.refresh();
          }

          public function stateFilterFunc(item:Object):Boolean {
          return this.envFilterFunction(item)&&
          this.dbTypeFilterFunction(item) &&
          this.schemaFilterFunction(item);
          }

          public function envFilterFunction ( item:Object ):Boolean {
          if(envCB.selectedLabel != "ALL")
          return item.environment.toLowerCase() == envCB.selectedLabel.toLowerCase();
          return true;
          }
          public function dbTypeFilterFunction ( item:Object ):Boolean {
          if(dbTypeCB.selectedLabel != "ALL")
          return item.connectionType.toLowerCase() == dbTypeCB.selectedLabel.toLowerCase();

          return true;
          }

          public function schemaFilterFunction ( item:Object ):Boolean {
          if(schemaCB.selectedLabel != "ALL")
          return item.schema.toLowerCase() == schemaCB.selectedLabel.toLowerCase();

          return true;
          }

          public function filterAC():void {
          model.dbConnAC.filterFunction=stateFilterFunc;
          model.dbConnAC.refresh();
          }

          public function resetAC():void {
          model.dbConnAC.filterFunction=null;
          model.dbConnAC.refresh();

          }


          ]]>
          </mx:Script>

          <viewUtil:ComboBox x="149" y="6" id="dbTypeCB" dataProvider="{model.dbTypeList}" width="100"></viewUtil:ComboBox>
          <viewUtil:ComboBox x="470" y="6" id="schemaCB" dataProvider="{model.schemaList}" width="100"></viewUtil:ComboBox>
          <mx:Button x="584" y="6" label="Filter" click="filterData(event)"/>
          <viewUtil:ComboBox x="296" y="6" id="envCB" dataProvider="{model.envList}" width="100"></viewUtil:ComboBox>
          <mx:Label x="114" y="8" text="Type:"/>
          <mx:Label x="268" y="8" text="Env:"/>
          <mx:Label x="416" y="8" text="Schema:"/>
          <mx:Label x="9" y="4" text="Filter Options:" styleName="stdTextExLg" color="#0080ff"/>


          </mx:Canvas>