from one combo box to another

vasilanthropos

02-16-2007, 03:12 PM

Hello. I want to do the following. I have a combo box with some phone numbers and i want by clicking on them to move them in a new combo box that is next to it (it is like a phonebook where i choose the phones that i want). My code is the following

<select name="combo1" size="10" multiple onchange="addme();">
<option value="1">11111</option>
<option value="2">22222</option>
</select>

<select name="combo2" size="10" multiple >
</select>

<script>
function addme(){
//document.combo1.options[document.combo1.selectedIndex].value;
// how can i get all the selected values and append them in the second
//combo box

}
</script>

BonRouge

02-16-2007, 03:32 PM

http://bonrouge.com/demos/move_option.htm

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>move option to another select box</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css">
* {
margin:0;
padding:0;
}
body {
background-color:white;
}
select {
display:block;
float:left;
width:5em;
}
</style>
<script type="text/javascript">
function addme() {
var numbersBox=document.getElementById('numbers');
numbersBox.onchange=function() {
var picked=this.value;
var newOption=document.createElement('option');
var text=document.createTextNode(picked);
newOption.appendChild(text);
newOption.value=picked;
document.getElementById('chosen').appendChild(newOption);
this.removeChild(this.options[this.selectedIndex]);
}
}
window.onload=addme;
</script>
</head>
<body>
<form method="post" action="#">
<p><select id="numbers" size="10">
<option value="one">One</option>
<option value="two">Two</option>
<option value="three">Three</option>
<option value="four">Four</option>
<option value="five">Five</option>
</select>
<select id="chosen" size="10"></select></p>
</form>
</body>
</html>

vasilanthropos

02-16-2007, 04:18 PM

Thanks a lot.It works fine :)