4 Replies Latest reply on Jan 20, 2011 11:21 AM by abhinav1singhal

    Filter function problem in Tree

    abhinav1singhal

      Hi All,

       

      In the below code, I am trying to put filter function on parent. Now if I type "Ratings" and then again clear the search. the Bottom node gets lost. Please let me know ho can I retin the bottom node. Please note that bottom node also contains "Rating" wth one less "s".

       

      here is the code.

      <?xml version="1.0" encoding="utf-8"?>

      <mx:Application

       

      xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"

      viewSourceURL="

      srcview/index.html"

      creationComplete="init()"

      >

       

       

       

      <mx:Script>

      <![CDATA[

       

       

      import vo.Person;

       

      import mx.collections.ArrayCollection;

       

       

       

       

      private function init():void{

       

      var person1:Person=new Person("Parent");

       

      var person2:Person=new Person("Watch Status");

       

      var chilPerson:Person=new Person("Ratings");

       

      var childPersion2:Person=new Person("rating");

       

      person1.children=

      new ArrayCollection([chilPerson]);

      person2.children=

      new ArrayCollection([childPersion2]);

       

      people.addItem(person1);

      people.addItem(person2);

      personsTree.dataProvider=people;

       

       

      }

      [

      Bindable]

       

      private var people:ArrayCollection = new ArrayCollection();

       

       

      private function refreshData():void{

       

       

      for (var i:int=0;i<this.people.length;i++){

       

      //reset the root node to its original unfiltered data

      people[i].children =

       

      new ArrayCollection(people[i].children.source);

       

      //start the recursion at the root node

      refreshRecursiveChildren(people.source[i]);

      }

       

       

      //update the Tree after the data has been filtered

      personsTree.invalidateList();

       

      people.filterFunction=filterData;

      people.refresh();

      }

       

      //end refreshData function

       

       

      private function refreshRecursiveChildren(person:Person):void{

       

      if(person.children){

       

      //loop through each child and filter its children

       

      for each(var _person:Person in person.children.source){

      refreshRecursiveChildren(_person);

      }

       

      //reset each "children" ArrayCollection to its original unfiltered data

      person.children =

      new ArrayCollection(person.children.source);

       

      //set the filterfunction for the newly updated node

      person.children.filterFunction = filterData;

       

      //run the fitlerFunction

      person.children.refresh();

      }

      }

      //end refreshRecursiveChildren function

       

       

      public function filterData(item:Object):Boolean{

       

      //get the string to filter the nodes by

       

      var searchString:String = iNameFilter.text;

       

      //if string is found in node return true.

       

      //since the recursive filtering takes place from bottom up, if

       

      //a collection still has children after filtering, also return true

       

      if(searchString.length == 0 || item.name.toLowerCase().indexOf(searchString.toLowerCase()) >= 0)

       

      return true;

       

      else if(item.children != null && item.children.length > 0)

       

      return true;

       

       

      return false;

      }

      //end filterData function

       

      ]]>

       

      </mx:Script>

       

       

      <mx:VBox width="200" height="300" paddingTop="10" paddingBottom="10" paddingLeft="5" paddingRight="5">

       

      <mx:Tree id="personsTree" dataProvider="{people}" labelField="name" width="100%" height="100%" />

       

      <mx:HBox>

       

      <mx:Label text="Filter the Tree:" />

       

      <mx:TextInput id="iNameFilter" change="refreshData()" />

       

      </mx:HBox>

       

      </mx:VBox>

       

      </mx:Application>

       

       

      Below is the Action script packge

      package

       

      vo{

       

       

      import mx.collections.ArrayCollection;

       

       

      public class Person{

       

       

      public var name:String;

       

      public var children:ArrayCollection;

       

       

      public function Person(_name:String, _children:ArrayCollection = null){

       

      this.name = _name;

       

      if(_children != null)

       

      this.children = _children;

      }

      //end Person constructor

       

      }

      //end Person class

       

      }

      //end package declaration

       

      Regards,

      Abhinav

       

        • 1. Re: Filter function problem in Tree
          Flex harUI Adobe Employee

          Tree does not support filters in the heirarchy.

           

          This post may contain useful tidbits:

          https://blogs.adobe.com/aharui/2008/12/tree_and_lazy_or_paged_data_1.html

           

          One of the tricks to trying to get this to work may involve a custom

          ITreeDataDescriptor.  You want to make sure the ArrayCollections the tree

          uses for the children are the same ones in your data structure.

          • 2. Re: Filter function problem in Tree
            abhinav1singhal Level 1

            As you can see I am using Array collection. Do you know any sample for the same? or canyou tweak this code to use ITreeDataDescriptor?

             

            Regards,

            Abhi.

            • 3. Re: Filter function problem in Tree
              Flex harUI Adobe Employee

              I understand you are using ArrayCollection, but I would double-check to make

              sure the datadescriptor.getChildren() is returning the child AC.

               

              I don't have the bandwidth to debug your test case right now, especially

              since filtering isn't supported.  Maybe someone else on the forum will help.

              • 4. Re: Filter function problem in Tree
                abhinav1singhal Level 1

                Hi ,

                I was able to fix this issue for my purpose. Below is the code that beeds to be chnaged to.

                private

                 

                 

                 

                 

                 

                function refreshData():void{

                 

                this.people=new ArrayCollection(this.people.source);

                 

                 

                for (var i:int=0;i<this.people.length;i++){

                 

                //reset the root node to its original unfiltered data

                people[i].children =

                 

                new ArrayCollection(people[i].children.source);

                 

                //start the recursion at the root node

                refreshRecursiveChildren(people.source[i]);

                 

                }

                 

                personsTree.invalidateList();

                people.filterFunction=filterData;

                people.refresh();

                 

                 

                this.callLater(expandAllAvailable);

                }

                //end refreshData function

                 

                Basically, I am reassigning the arraycollection to its source whenever a new character is typed in. This will do a proper filtering to complete new arrayCollection.

                 

                Thanks for your prompt responses so far. I really appreciate it.

                 

                Regards,

                Abhinav