Categorized & Searchable List Boxes | JavaScriptSource

Categorized & Searchable List Boxes

Steve Chipman Oct 8, 2008


This script creates a list of categorized links from a data array. The list is also searchable. A great navigational aid for small spaces. Very easy to implement.

Click to view the demonsration.


Source Code

Paste this source code into the designated areas.

External file

Paste this code into an external JavaScript file named: catSearchBox.js


Paste this code into your external CSS file or in the <style> section within the HEAD section of your HTML document.


Paste this code into the HEAD section of your HTML document.


Paste this code into the BODY section of your HTML document

Leave a Response


John,[br /][br /]Due to the complexity of the script, you will need to post your question over on [a href=""]the JavaScript forum[/a]. Thanks!

Lee Dec 2, 2008

It works now. Thanks!

Lee Oct 31, 2008

Great script, I've been looking for something exactly like this for a long time! Thanks a lot!

James Oct 13, 2008

Getting "ERROR: Script categorized-searchable-list-boxes.html is missing at /www2/jss/cgi-bin/scriptbot2.cgi line 53." when trying to get script emailed to me.[br /][br /]Ron

Ron Oct 13, 2008

How can this script be modified to open the reference link in a new web page, such as with the argument target="_blank"? I cannot see how to do it from the javascript, nor can I seem to modify the function call from the body of the calling page. Is there a way to do this?[br /][br /]I am trying to preserve the page which is linking, rather than be forced to do a 'back' to get to this page. I use both Firefox and Chrome, but multiple browsers permit having several active tags; I'd like to use this functionality.

John B. Moss Oct 12, 2008