moglie
asked on
Filtering a Flex tilelist using RegExp
I'm trying to filter a Flex tilelist that's populated via XMLListCollection with a RegExp. I created the following code for a datagrid that works. But when applied to a tilelist, I get a "value is not a function". I guess the problem is in the item.text() portion. But anyone know how I could get this to work with the tileList?
private function filterFunc(item:Object):Boolean {
var allWords:String=searchField.text;
allWords = allWords.replace(/\s+/g,"|");
return item.text().match(new RegExp(allWords, "i"));
}
ASKER
Using the quotes didn't change anything. Still getting that "not a function" error. Someone on another forum mentioned that an item of type object doesn't have a method called text and that's causing the problem. But I don't know, it works on a datagrid as expected.
Did you try taking the parens of of text?
I am not a flex programmer, but I'm just trying to be logical, so please forgive me if I sound retarded :)
I am not a flex programmer, but I'm just trying to be logical, so please forgive me if I sound retarded :)
return item.text.match(new RegExp(allWords, "i"));
ASKER
I've tried all the small trial-and-error things like that but it's still the same error.
I would pass a String in to the function, instead of an object.
Then before you call the function, you would cast the item to a string
ie.
Then before you call the function, you would cast the item to a string
ie.
...
..
.
var itemText:String = item.text as String; // You could do this in the function, But this way only a Sting can be passed to the function rather than any object, which gives runtime errors rather than compile time errors.
var isFiltered:Boolean = filterFunction(itemText); // call the function
.
private function filterFunc(itemText:String):Boolean
{
var allWords:String=searchField.text;
allWords = allWords.replace(/\s+/g,"|");
return itemText.match(new RegExp(allWords, "i"));
}
ASKER
Must be getting close here. There's one error popping up on the line
var itemText:String = item.text as String; "access to undefined property item"
var itemText:String = item.text as String; "access to undefined property item"
item is just a variable to hold your object. you need to assign that variable as something.
ie the object that you passed into the filterFunc(item:Object):Bo olean before. I assume that it is an object in the TileList
ie the object that you passed into the filterFunc(item:Object):Bo
...
..
.
var item:Object = yourObject // this is the object that you were trying to pass to the function before
var itemText:String = item.text as String; // You could do this in the function,
But this way only a String can be passed to the function rather than any object,
which gives runtime errors rather than compile time errors.
var isFiltered:Boolean = filterFunction(itemText); // call the function
.
private function filterFunc(itemText:String):Boolean
{
var allWords:String=searchField.text;
allWords = allWords.replace(/\s+/g,"|");
return itemText.match(new RegExp(allWords, "i"));
}
ASKER
My original code worked on a datagrid and I never referenced item anywhere....so maybe item is part of the datagrid component? Now I'm getting really lost. haha
ok, so that your code works just change your function to this, however if you pass an object without a text property it will throw an error.
private function filterFunc(item:Object):Boolean
{
var allWords:String=searchField.text;
allWords = allWords.replace(/\s+/g,"|");
var itemText:String = item.text as String;
return itemText.match(new RegExp(allWords, "i"));
}
ASKER
Yeah, the error that comes up is can't access a property of a null item.. It's looking like this can't be done.
If you post code that calls this function, there is a way.
ASKER
This is all the relevant code:
private function filterFunc(item:Object):Bo olean {
var allWords:String=stateName. text;
allWords = allWords.replace(/\s+/g,"| ");
return item.text().match(new RegExp(allWords, "i"));
}
<mx:XML id="xml" source="gallery.xml"/>
<mx:XMLListCollection id="xmlListColl" source="{xml.image}" filterFunction="filterFunc " />
<mx:TileList id="tileList" dataProvider="{xmlListColl }" columnCount="3" columnWidth="200"
rowCount="2" rowHeight="200" themeColor="haloSilver" verticalScrollPolicy="on" itemClick="tileList_itemCl ick(event) ;" >
<mx:itemRenderer>
<mx:Component>
<mx:VBox paddingLeft="30" width="150" height="150" horizontalScrollPolicy="of f" verticalScrollPolicy="off" >
<mx:Image height="50" width="50" source="{data.@thumbnailIm age}" />
<mx:Label id="foo" text="{data.@title}" />
</mx:VBox>
</mx:Component>
</mx:itemRenderer>
</mx:TileList>
<mx:TextInput id="searchField" change="xmlListColl.refres h()"/>
private function filterFunc(item:Object):Bo
var allWords:String=stateName.
allWords = allWords.replace(/\s+/g,"|
return item.text().match(new RegExp(allWords, "i"));
}
<mx:XML id="xml" source="gallery.xml"/>
<mx:XMLListCollection id="xmlListColl" source="{xml.image}" filterFunction="filterFunc
<mx:TileList id="tileList" dataProvider="{xmlListColl
rowCount="2" rowHeight="200" themeColor="haloSilver" verticalScrollPolicy="on" itemClick="tileList_itemCl
<mx:itemRenderer>
<mx:Component>
<mx:VBox paddingLeft="30" width="150" height="150" horizontalScrollPolicy="of
<mx:Image height="50" width="50" source="{data.@thumbnailIm
<mx:Label id="foo" text="{data.@title}" />
</mx:VBox>
</mx:Component>
</mx:itemRenderer>
</mx:TileList>
<mx:TextInput id="searchField" change="xmlListColl.refres
This error would have come back if the parenthesis had been removed from:
return item.text().match(new RegExp(allWords, "i")); it should have been:
return item.text.match(new RegExp(allWords, "i"));
Anyway item is the XML object created, so you just need the name of the node that you want to filter, which appears to be title?
return item.text().match(new RegExp(allWords, "i")); it should have been:
return item.text.match(new RegExp(allWords, "i"));
Anyway item is the XML object created, so you just need the name of the node that you want to filter, which appears to be title?
private function filterFunc(item:Object):Boolean // item is an XML object
{
var allWords:String=searchField.text;
allWords = allWords.replace(/\s+/g,"|");
var itemText:String = item.@title as String; // here is where you want
// to put the name of the node you want to filter.
return itemText.match(new RegExp(allWords, "i"));
}
ASKER
Still getting a null object. There's also a warning on the return line "array used where a boolean value is expected" I've attached a test file if that would help. Maybe the xml is causing the problem?
<gallery>
<image title="Flex"
thumbnailImage="assets/fx_appicon-tn.gif"
fullImage="assets/fx_appicon.jpg"/>
<image title="Flash n lots of stuff"
thumbnailImage="assets/fl_appicon-tn.gif"
fullImage="assets/fl_appicon.jpg"/>
<image title="Illustrator"
thumbnailImage="assets/ai_appicon-tn.gif"
fullImage="assets/ai_appicon.jpg"/>
<image title="Dreamweaver"
thumbnailImage="assets/dw_appicon-tn.gif"
fullImage="assets/dw_appicon.jpg"/>
<image title="ColdFusion"
thumbnailImage="assets/cf_appicon-tn.gif"
fullImage="assets/cf_appicon.jpg"/>
<image title="Flash Player"
thumbnailImage="assets/fl_player_appicon-tn.gif"
fullImage="assets/fl_player_appicon.jpg" />
</gallery>
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Thanks! Finally working now.
Open in new window