When developing web applications, select-boxes are usually involved in the UI. I’ve put together a custom JavaScript class to handle things like removing, adding and selecting elements. By the way, Matt Kruse has a bunch of nice JavaScript libraries!

Example:

var e=new DynamicSelect('MySelect');
e.removeAll();
e.append('Entry 1','');
e.append('Entry 2','');
e.selectAll();
e.unselectAll();
e.select('Entry 2');
e.toggleAll();
if(e.contains('Entry 1')){
alert('We got Entry 1!');
}
if(e.indexOf('Entry 2'!=-1)){
alert('We got Entry 2!');
}
e.insert('Entry 0','',0);
e.select('Entry 2');
e.removeSelected();
e.remove(0);
alert('Original HTML element name: '+e.parent().name);

The methods are documented in the source file, if you want to know more about them.

• DynamicSelect.js

[tags]JavaScript[/tags]

This has been done before. Here is my contribution:

/**
* Replaces \\\"No Documents Found\\\" with a custom text.
*
* @author Johan Känngård, http://johankanngard.net
* @param message the text to replace with
*
*/
function replaceNoDocumentsFound(message){
var h2=document.getElementsByTagName(\\\'h2\\\');
if(h2!=\\\'undefined\\\'&&h2.length>0&&h2[0]!=\\\'undefined\\\') {
var oldTextNode=h2[0].firstChild;
var newTextNode=document.createTextNode(message);
h2[0].replaceChild(newTextNode,oldTextNode);
}
}


Put the function in the HTML Head (or in an imported JS-file) and call the function at the bottom at the page like this:



The easiest way to hide the text is via a stylesheet like this:

…but you already knew that, huh?
[tags]JavaScript, DOM, Lotus Domino, CSS[/tags]