Home > adobe air > Learning Employee Directory 3.3 Component

Learning Employee Directory 3.3 Component

February 13th, 2008

Return to table of contents
1. CustomAutoComplete

This component can be very useful. It pops up a list of suggestions based on characters entered by the user. This is a very simple example on how to use it:

<controls:CustomAutoComplete id="searchInput"
typedTextChange="onTextChange();"
selectionChange="onSelectionChange();"
dataProvider="{ searchResults }"
lookAhead="true"
labelField="displayName"/>

And below is the the script part of the main mxml file I used to test this component.

   import mx.controls.Alert;

   import mx.collections.ArrayCollection;

   [Bindable]
   private var searchResults:ArrayCollection  = new ArrayCollection();
   private var all:ArrayCollection  = new ArrayCollection();
   private function init():void
   {
    all.addItem({displayName:"abc", name:"Jack Smith"});
    all.addItem({displayName:"abd", name:"John Win"});
    all.addItem({displayName:"abe", name:"Bob XC"});
    all.addItem({displayName:"acd", name:"LIN Bobby"});
    all.addItem({displayName:"efg", name:"xie iix"});
    all.addItem({displayName:"efv", name:"xfe abc"});
    all.addItem({displayName:"hik", name:"45 65"});
   }
   private function onTextChange():void
   {
    searchResults.removeAll();
    var ii:int;
    for(ii=0;ii<all.length;ii++)
    {
     if (all[ii].displayName.indexOf(searchInput.typedText) != -1)
      searchResults.addItem(all[ii]);
    }
   }
   private function onSelectionChange():void
   {
    mx.controls.Alert.show(searchInput.selectedItem.name);
   }
Author: Xu Cui Categories: adobe air Tags:
About the author:

Xu Cui is a human brain research scientist in Stanford University. He lives in the Bay Area in the United States. Check out PaperBox and BizGenius he runs.

 

He was born in He'nan province, China. He received education in Beijing University(BS), University of Tennessee (Knoxville) (MS), Baylor College of Medicine (PhD) and Stanford University (PostDoc). Read more ...
  1. No comments yet.
CAPTCHA Image