Selectbox Functions with Javascript

These functions allowed you to do commonly-requested actions with select boxes.

For example, you can easily pass values between two select boxes. This makes a nice Windows-style interface for choosing components, adding and removing items from a list, etc. Options are re-ordered as they are added and removed from the lists.

Several other functions are included in the source that are not in the examples. This includes copying items in lists instead of moving them, copying/moving all items, and automatically selecting all items in a list.

DESCRIPTION: These are general functions to deal with and manipulate
select boxes. Also see the OptionTransfer library to more easily
handle transferring options between two lists

COMPATABILITY: These are fairly basic functions – they should work on
all browsers that support Javascript.

Code:
// ——————————————————————-
// hasOptions(obj)
// Utility function to determine if a select object has an options array
// ——————————————————————-
function hasOptions(obj) {
if (obj!=null && obj.options!=null) { return true; }
return false;
}

// ——————————————————————-
// selectUnselectMatchingOptions(select_object,regex,select/unselect,true/false)
// This is a general function used by the select functions below, to
// avoid code duplication
// ——————————————————————-
function selectUnselectMatchingOptions(obj,regex,which,only) {
if (window.RegExp) {
if (which == “select”) {
var selected1=true;
var selected2=false;
}
else if (which == “unselect”) {
var selected1=false;
var selected2=true;
}
else {
return;
}
var re = new RegExp(regex);
if (!hasOptions(obj)) { return; }
for (var i=0; i (b.text+”")) { return 1; }
return 0;
}
);

for (var i=0; i object as follows:
// onDblClick=”moveSelectedOptions(this,this.form.target)
// This way, when the user double-clicks on a value in one box, it
// will be transferred to the other (in browsers that support the
// onDblClick() event handler).
// ——————————————————————-
function moveSelectedOptions(from,to) {
// Unselect matching options, if required
if (arguments.length>3) {
var regex = arguments[3];
if (regex != “”) {
unSelectMatchingOptions(from,regex);
}
}
// Move them over
if (!hasOptions(from)) { return; }
for (var i=0; i=0; i–) {
var o = from.options[i];
if (o.selected) {
from.options[i] = null;
}
}
if ((arguments.length=0; i–) {
if (obj.options[i].selected) {
if (i != (obj.options.length-1) && ! obj.options[i+1].selected) {
swapOptions(obj,i,i+1);
obj.options[i+1].selected = true;
}
}
}
}

// ——————————————————————-
// removeSelectedOptions(select_object)
// Remove all selected options from a list
// (Thanks to Gene Ninestein)
// ——————————————————————-
function removeSelectedOptions(from) {
if (!hasOptions(from)) { return; }
if (from.type==”select-one”) {
from.options[from.selectedIndex] = null;
}
else {
for (var i=(from.options.length-1); i>=0; i–) {
var o=from.options[i];
if (o.selected) {
from.options[i] = null;
}
}
}
from.selectedIndex = -1;
}

// ——————————————————————-
// removeAllOptions(select_object)
// Remove all options from a list
// ——————————————————————-
function removeAllOptions(from) {
if (!hasOptions(from)) { return; }
for (var i=(from.options.length-1); i>=0; i–) {
from.options[i] = null;
}
from.selectedIndex = -1;
}

// ——————————————————————-
// addOption(select_object,display_text,value,selected)
// Add an option to a list
// ——————————————————————-
function addOption(obj,text,value,selected) {
if (obj!=null && obj.options!=null) {
obj.options[obj.options.length] = new Option(text, value, false, selected);
}
}