Search/Filter a text list by Javascript key-up

Here’s is a sample code on how to search through a list in Javascript. This code will search from a list of texts from a given key word, and triggers upon key-up ( after typing a keyword/letters ).

For example, given the following list below:

the
quick
brown
quail
fox

Then if given the keyword/text “qui”, it then displays this list

quick
quail

Here is the sample code:

$(."search-textbox").keyup(function(){
 var query = $(this).val().toLowerCase //search is case insensitive
 var index;
 var listMember;

 $.each(contactList, function ( Key, val ){
  index = val.index;
  listMem = val.listMember;

 if(listMem.toLowerCase().indexOf(query) !== -1)
 {
  $(".result_class").find("li-li-"+index).show();
 } else {
  $(".result_class").find("li-li-"+index).hide();
 }
}); 

Class names may vary, depnding on the JSP/HTML code.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s