Filter/Search Flex中基于用户在文本区输入文本的Array Collection列表框

Question

我有一个带有 arrayCollection 的 MXList 框，还有另一个文本框。

我的需求是：当用户在文本区域输入想要的文本时，我需要从列表中获取并显示匹配的记录，如：

___________
|____Ka___|    Text area
__________
|Kanrna   |List Box : ArrayCollection
|Kam      |
|Kao      |
|kaddsd   |So it looks something like this 
|_________|

我尝试过各种方法：

<mx:List id="availableProfileList"
    dataProvider="{campaignProxy.campaignWizardVo.currentProfiles}""/>

<mx:TextArea id="textSearch" textInput="applyFilter()"/>

protected function applyFilter():void{
    campaignProxy.campaignWizardVo.currentProfiles.filterFunction = matchingFunction(campaignProxy.campaignWizardVo.currentProfiles, textSearch.text);
    //Alert.show(textSearch.text)
    //availableProfileList.findString(textSearch.text);
    //availableProfileList.setFocus();
}

public function matchingFunction(availableProfileList:List, text:String):Vector.<int> {
             var results:Vector.<int> = new Vector.<int>;
             var item:String;
             var entered:String = text.toLowerCase();
           var itemIdx:int;
           Alert.show("before for");
           for(var idx:int = 0; idx < availableProfileList.dataProvider.length; idx++) {
           item = availableProfileList.dataProvider.getItemAt(idx) as String;
                 item = item.toLowerCase();
                 itemIdx = item.indexOf(entered);
                 if(item.indexOf(entered) > -1) {
                     results.push(idx);
                 }
           }
           return results;
             }

检查完这些问题后：

combobox which filters dataprovider based on user input 和：

Flex - Search/Filter DataGrid by Text Input

我还是不明白如何让它发挥作用。

Answer 1

filterFunction 是 ArrayCollection 的属性，它应该只设置一次。然后.

<mx:List id="availableProfileList"
    dataProvider="{campaignProxy.campaignWizardVo.currentProfiles}""/>

<mx:TextArea id="textSearch" textInput="{campaignProxy.campaignWizardVo.currentProfiles.refresh();}"/>

filterFunction 必须接受一个应该是集合项的参数，并且 return true 如果该项应该可见，否则 false。数据提供者的 refresh 方法强制进行过滤。

function filterList(item:Object):Boolean
{
    // Returns true if item label (or title, or name, I don't remember)
    // starts with the text in the input area, case insensitive.
    return item.label.toLowerCase.indexOf(textSearch.text.toLowerCase()) == 0;
}

免责声明：以上仅供参考，并非完整解决方案，详情请自行判断。

Answer 2

<mx:TextInput id="textSearch" maxChars="30" width="230" height="20.004135" change="applyFilter()" enabled = "true"
/>  


protected function applyFilter():void{
                    (availableProfileList.dataProvider as ArrayCollection).filterFunction = filterFunc;
                    (availableProfileList.dataProvider as ArrayCollection).refresh();
                }

public function filterFunc(item:Object):Boolean{
                    var searchedStr:String = textSearch.text;
                    var profile:ProfileVO = item as ProfileVO;
                    if (searchedStr == null) {
                        return (availableProfileList.dataProvider as ArrayCollection).refresh();
                    }
                    else {
                        return profile.profileName.toLowerCase().indexOf(searchedStr.toLowerCase()) == 0;
                    }
                }

Filter/Search Flex中基于用户在文本区输入文本的Array Collection列表框

Filter/Search List box of Array Collection based on the user input text entered in the text area in Flex

javascript

java

actionscript-3

apache-flex

actionscript