DHTML Select Demo

This simple demonstration shows how to use DOM-compliant JavaScript methods to add and remove options from a select-style drop-down list.


Create a new option using these values:

Text:

Value:

Delete an option using this button:


Code used:

/* 
 This function adds the new option, taking
 the select element in as an argument.
*/
function addOption(selObj, sText, sValue){
 var opt = document.createElement('option');
 var txt = document.createTextNode(sText);

 opt.setAttribute('value', sValue);
 
 opt.appendChild(txt);
 selObj.appendChild(opt);

 return false;
}

/* 
 This function delete the selected option, 
 taking the select element as an argument.
*/
function removeOption(selObj){
 var opt = selObj.options[selObj.selectedIndex];
 selObj.removeChild(opt);
 
 return false;
}

Coded by Jake Howlett. For more information please visit codestore.net or Rockall Design.