combobox which filters dataprovider based on user input

问题

I need a combobox which filters dataprovider based on user input?

For example if user input is "CA" combobox will filter the dataprovider and show only data which starts with "CA". ("CANADA" and "CALIFORNİA")

note:combobox is editable.

and ı need this combobox in flex 3.

edit:okay ı got some help from javaluca and ı wrote this.

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" 
    creationComplete="createCompFonk()">
    <mx:Script>
     <![CDATA[
        import mx.controls.Text;
        import mx.controls.dataGridClasses.DataGridColumn;
     import mx.controls.TextInput;
 import mx.events.ItemClickEvent;
 import mx.events.DataGridEvent;
 import mx.collections.ArrayCollection;
import mx.controls.Alert;
import mx.collections.ListCollectionView; 
import mx.controls.ComboBox

     var sayac:int=0;
     var degisken:String;

     [Bindable]
     private var initDG:ArrayCollection = new ArrayCollection([ {islem:'Tahsilat112', tarih:'01/01/2000', isim:'ATA'},{islem:'Ödeme', tarih:'02/03/2010', isim:'BETA'}      ]);




      public function createCompFonk():void{
        gggcombo.textInput.addEventListener(TextEvent.TEXT_INPUT, textChange);

      }
    protected function textChange(evt:TextEvent):void{
    (gggcombo.dataProvider as ArrayCollection).filterFunction = filterFunc;
    (gggcombo.dataProvider as ArrayCollection).refresh();
    // REFRESH IS NECESSARY
}

public function filterFunc(item:Object):Boolean{
    var pattern:String = gggcombo.textInput.text.toLowerCase();
    var string:String = item.islem;

    return pattern == string.substr( 0, pattern.length );
}
        ]]>
      </mx:Script>


  <mx:Panel x="0" y="0" width="435" height="216" 
      layout="absolute" title="Empty Default Datagrid">


   <mx:ComboBox id="gggcombo" dataProvider="{initDG}" labelField="islem" editable="true"  >


   </mx:ComboBox>
  </mx:Panel>


</mx:Application>

but ı got an error on these rows :

gggcombo.textInput.addEventListener(TextEvent.TEXT_INPUT, textChange);

and

 var pattern:String = gggcombo.textInput.text.toLowerCase();

Error is : Attempted acces of inaccesible property textInput through a reference with static type mx.controls:comboBox

回答1:

If you are using ArrayCollection Class for combobox dataprovider, you can use the filterFunction.

Add listener on textInput that is contained into the combo

myCombo.textInput.addEventListener(TextEvent.TEXT_INPUT, textChange);

Function dispatched on the textChange

protected function textChange(evt:TextEvent):void{
    (myCombo.dataProvider as ArrayCollection).filterFunction = filterFunc;
    (myCombo.dataProvider as ArrayCollection).refresh();
    // REFRESH IS NECESSARY
}

FilterFunction for filtering dataProvider

public function filterFunc(item:Object):Boolean{
    var pattern:String = myCombo.textInput.text.toLowerCase();
    var string:String = item.name;

    return pattern == string.substr( 0, pattern.length );
}

来源：https://stackoverflow.com/questions/28806821/combobox-which-filters-dataprovider-based-on-user-input

标签

eclipse

actionscript-3

apache-flex

flex3