[JAVASCRIPT] how to add options to dropdown boxes dynamically
HOw? :(
somehow the add function here won't work :( :confused:
HTML Code:
<html>
<head>
<script type="text/javascript">
function formAction(choice)
{
var from, to;
var selected;
switch(choice){
case 1:
from=document.getElementById("myFirstList")
to=document.getElementById("mySecondList")
alert("event fired first to second")
break;
case 2:
from=document.getElementById("mySecondList")
to=document.getElementById("myFirstList")
alert("event fired second to first")
break;
}
selected = from.options[from.selectedIndex].text
alert(selected)
from.remove(from.selectedIndex)
to.add(selected);
alert(from.length + ", " + to.length)
}
</script>
</head>
<body>
<form name="anotherform">
<select id="myFirstList" size=4>
<option>One</option>
<option>Two</option>
<option>Three</option>
<option>four</option>
</select>
<input type="button" onclick="formAction(1)" value="FIrst >> SEcond">
<input type="button" onclick="formAction(2)" value="second >> first">
<select id="mySecondList" size=4>
</select>
</form>
</body>
</html>
Re: [JAVASCRIPT] how to add options to dropdown boxes dynamically
I searched the forum and indeed there have been other questions relating to this one but there are no answers posted on this forum.. so I will post the one my friend taught me. :)
Code:
from.remove(from.selectedIndex)
var newOption = new Option();
newOption.text = selected
to.options[to.length] = newOption;
It seems I was missing Option Objects.
Re: [JAVASCRIPT] how to add options to dropdown boxes dynamically
Code:
<html>
<head>
<script type="text/javascript">
function formAction(choice)
{
var from, to;
var selected;
switch(choice){
case 1:
from=document.getElementById("myFirstList")
to=document.getElementById("mySecondList")
//alert("event fired first to second")
break;
case 2:
from=document.getElementById("mySecondList")
to=document.getElementById("myFirstList")
//alert("event fired second to first")
break;
}
selected = from.options[from.selectedIndex].text
//alert(selected)
/*
from.remove(from.selectedIndex)
var newOption = new Option();
newOption.text = selected
to.options[to.length] = newOption;
*/
to.options[to.length] = from.options[from.selectedIndex];
//alert(from.length + ", " + to.length)
}
</script>
</head>
<body>
<form name="anotherform">
<select id="myFirstList" size=4>
<option>One</option>
<option>Two</option>
<option>Three</option>
<option>four</option>
</select>
<input type="button" onclick="formAction(1)" value="FIrst >> SEcond">
<input type="button" onclick="formAction(2)" value="second >> first">
<select id="mySecondList" size=4>
</select>
</form>
</body>
</html>
the code in bold now i discovered automatically moves the options from one select to another.. hmm... didn't know it... lesser code... that was what I wanted.. move an option from one dropdown box to another. and there is a one line code for that :(
Re: [JAVASCRIPT] how to add options to dropdown boxes dynamically
Ok, I'm confused oceane. Did you solve the problem or do you still have any questions? I'd be glad to help if you were still having issues with this. Thanks. :)
Re: [JAVASCRIPT] how to add options to dropdown boxes dynamically
A friend gave me the answers.. so I posted it, then also stumbled something(assigning an option from one select box into another moves that option to that other select box) and posted it.. basically solved ;)
thanks eyeR
