This article will explain how to create a wildcard search. What I mean is the following:
dir *.*
or
dir myfile??.txt
The old DOS searching way. The first command (if you’ll run them in Command Prompt) returns all files with extension from the current folder. The second command will return any file having its name as this: myfile00.txt, myfilecc.txt or myfile_t.txt.
Take a look at the following application:
Clicking on the Filter button or pressing Enter key on the text input will apply the wildcard string onto the list bellow.
This is the entire code. Is commented and well explained but even though you may need some knowledge about Regular Expressions (or Regexp).
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 | <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="init()" width="400" height="200"> <mx:Label x="10" y="12" text="Wildcard string:"/> <mx:TextInput id="search" x="110" y="10" width="207" keyUp="handleDoSearch(event)"/> <mx:Button x="325" y="10" label="Filter" click="handleDoSearch(event)"/> <mx:DataGrid x="10" y="40" width="380" height="150" dataProvider="{dataGridData}"> <mx:columns> <mx:DataGridColumn headerText="Filename" dataField="@filename"/> <mx:DataGridColumn headerText="Size" dataField="@size"/> <mx:DataGridColumn headerText="Date" dataField="@date"/> </mx:columns> </mx:DataGrid> <mx:Script> <![CDATA[ // variable binded to the data grid // this is the variable that we will modify [Bindable] private var dataGridData:XMLList = new XMLList(); // base data - this variable will not be modified private var dataGridStartData:XML = <root> <row filename="file_cc" size="123" date="2008-08-07" /> <row filename="file_b" size="12" date="2008-08-08" /> <row filename="file_a" size="56" date="2008-08-01" /> <row filename="my_f^ile" size="1786" date="2008-08-01" /> <row filename="special-_$+./file" size="23" date="2008-08-03" /> <row filename="te\\s]|t_1" size="899" date="2008-07-04" /> <row filename="te[st_2" size="777" date="2008-06-04" /> </root>; // handler for filtering // used by both: button and text input private function handleDoSearch(event:Event):void { // checking the event type if (event is MouseEvent || (event is KeyboardEvent && (event as KeyboardEvent).keyCode == 13 ) ) { // if there is at least one caracter in the text input if (search.text.length > 0) { // reset the data grid binded variable dataGridData = new XMLList(); // new temporary xml var tempData:XML = new XML("<root></root>"); // looping through the base data for each (var item:XML in dataGridStartData.children()) { // matching wildcard string if (matchWildcards(item.@filename,search.text)) { // add a new child var tempXMLItem:XML = new XML("<row></row>"); tempXMLItem["@filename"] = item.@filename; tempXMLItem["@size"] = item.@size; tempXMLItem["@date"] = item.@date; tempData.appendChild(tempXMLItem); } } // set the binded data to the new found items dataGridData = tempData.children(); } else { // reset the binded data to base data dataGridData = dataGridStartData.children(); } } } // matching wildcard string to the string private function matchWildcards(string:String, searchTerm:String):Boolean { // we use regexp to search var regexp:String = new String(); // escape special chars like: $&.- which are // special chars for regexp language // but we won't put here * and ? which are // our search characters regexp = searchTerm.replace( new RegExp("([{}\(\)\^$&.\/\+\|\[\\\\]|\]|\-)","g"),"\\$1"); // we transform wildcards to regexp like this: // * = .* // ? = .? regexp = regexp.replace(new RegExp("([\*\?])","g"),".$1"); // the string is from the beginning to the end regexp = "^" + regexp + "$"; // return true is found return (string.search(regexp) >= 0 ? true : false); } // initialization private function init():void { // data grid initialization dataGridData = dataGridStartData.children(); } ]]> </mx:Script> </mx:Application> |
The important function is matchWildcards which takes two parameters: the first one is the string to search into and the second one is the search term or the filtering string. The function return true or false depending if the two strings matches or not.
As explained in the code in the matchWildcards the following step are taken:
- escape special regexp characters
- transform wildcards to regexp:
“*” into “.*”
“?” into “.?”
(exclude commas) - add beginning and end regexp constraints: “^” and “$” (exclude commas)
- search it and return the result
This is it. Hope this will be helpful.
Tags: ActionScript, MXML, search, wildcards
This post was written by Andrei Ionescu
Views: 4626
Articles
Hi there,
I dunno if its only me but the search doesnt return any results even if i write the full file name on it.
Cheers
Hello Taniguchi,
I tested the working example and I entered “file*” then pressed “Filter” button, and returned 3 results. Then I entered “filter_cc” and pressed “Filter” which return one result. And I asked another person to test it and it is really working.
Its case sensitive, which windows isn’t.
Name, thanks for your comment. Yes, it is case sensitive as any OS should be.
lol, that was my prob! It IS case sensitive! Shame on myself…