Home » actionscript 3.0

Search Manager Suggest tool(AS3)

14 October 2008 5 Comments

Google Suggest?
As you type into the search box, Google Suggest guesses what you’re typing and offers suggestions in real time. This is similar to Google’s “Did you mean?” feature that offers alternative spellings for your query after you search, except that it works in real time.

I had seen same feature done using Dot net, Ajax, and PHP etc.
You can also see the feature live here ObjectGraph Dictionary thats suggests us as we type.

I utilized the event driven nature of Action Script 3.0 and I came with this SearchManager class or we can also say as flash version of Google suggest We have seen the Google suggest that will suggests the names according to the input values, I searched the web for suggest tool in flash, so I came up with this Manager class.

Type capital ‘S’ here..

Here the code in Flash

import com.flashflex.*;
//Array of data to be searchable
var toSearchArray:Array = new Array();
toSearchArray.push( "Belinda" );
toSearchArray.push( "Gina" );
toSearchArray.push( "Benny" );
toSearchArray.push( "Charlotte" );
toSearchArray.push( "Jane" );
toSearchArray.push( "Raja" );
toSearchArray.push( "Saravanan" );
toSearchArray.push( "Ramesh" );
toSearchArray.push( "Selva" );
toSearchArray.push( "Muza" );
toSearchArray.push( "Kalis" );
toSearchArray.push( "Prasath" );
toSearchArray.push( "Sharmila" );
toSearchArray.push( "Santha" );
toSearchArray.push( "Vijay" );
toSearchArray.push( "Bipin" );
toSearchArray.push( "Vinod" );
toSearchArray.push( "Vipin" );
toSearchArray.push( "Robert" );
toSearchArray.push( "Mahesh" );
toSearchArray.push( "Vel" );
toSearchArray.push( "Chitra" );
toSearchArray.push( "Ganesan" );
toSearchArray.push( "Mathan" );
toSearchArray.push( "Asan" );
toSearchArray.push( "sara" );

//Create objects of searchable items
var len:Number = toSearchArray.length;
for (var i:int = 0; i<len; i++) {
var _searchItem:SearchItem = new SearchItem(toSearchArray[i]);
addChild(_searchItem);
}

txtItem.restrict = "a-zA-Z";
txtInput.restrict = "a-zA-Z";
addSearchItem.addEventListener( MouseEvent.CLICK, handleAddSearchItem );
txtInput.addEventListener( Event.CHANGE, handleTextInputChange );

function handleAddSearchItem( event : MouseEvent ) {
var searchItemData : String = txtItem.text;
if ( searchItemData.length > 0 ) {
toSearchArray.push( txtItem.text );
var _searchItem:SearchItem = new SearchItem(txtItem.text);
addChild(_searchItem);
}
}
//Dispaching event to check the searchable data
function handleTextInputChange( event : Event ) {
SearchResult.clearData();
dispatchEvent(new ObjectEvent(ObjectEvent.OBJECT_EVENT, true, txtInput.text));
_resultList.dataProvider = (SearchResult.getResult());
}

Explanation for code:
Create an Array that holds the data to be searchable; here we have the data in toSearchArray.
Create objects to SearchItem and add to the display list since we extends MovieClip and also to get the Event bubbling to work.

for (var i:int = 0; i<len; i++) {
var _searchItem:SearchItem = new SearchItem(toSearchArray[i]);
addChild(_searchItem);
}

At the TextChange Event handler we are dispatching Object Event and adding the searchItem to list and displaying the whole list atlast.

function handleTextInputChange( event : Event ) {
SearchResult.clearData();
dispatchEvent(new ObjectEvent(ObjectEvent.OBJECT_EVENT, true, txtInput.text));
_resultList.dataProvider = (SearchResult.getResult());
}

Feel free to modify, extend and distribute the code..

Download Source Files

Cheers
Saravanan

:)

VN:F [1.7.7_1013]
Rating: 0.0/10 (0 votes cast)
VN:F [1.7.7_1013]
Rating: 0 (from 0 votes)

Leave your response!

Add your comment below, or trackback from your own site. You can also subscribe to these comments via RSS.

Be nice. Keep it clean. Stay on topic. No spam.

You can use these tags:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

This is a Gravatar-enabled weblog. To get your own globally-recognized-avatar, please register at Gravatar.