Moving Items from a listbox

[andrewsmd]

I have a function where I am trying to move all of the items from a listbox to another one. My function is only moving the odd elements right now. i.e. ids 1, 3, 5 etc. What is wrong with it? Here is my JS

function test(bxFrom, bxTo) {

var varFromBox = document.getElementById(bxFrom);
var varToBox = document.getElementById(bxTo);

if (varFromBox.options.length < 1) {
alert('There are no items in that box');
return false;
} //if

for (var i = 0; i < varFromBox.options.length; ++i) {

var newOption = new Option(); // Create a new instance of ListItem
newOption.text = varFromBox.options[i].text;
newOption.value = varFromBox.options[i].value;
varToBox.options[varToBox.options.length] = newOption; //Append the item in Target Listbox
varFromBox.remove(i); //Remove the item from Source Listbox


} //for

}//test

[raheelajk]

andrewsmd,

Don't remove nodes from first select box simultaneously. That effect the length attribute of it and hence resulting into uneven population of second select box. Use the following function

function test(bxFrom, bxTo) {

var varFromBox = document.getElementById(bxFrom);
var varToBox = document.getElementById(bxTo);

if (varFromBox.options.length < 1) {
alert('There are no items in that box');
return false;
} //if
var fieldLength = varFromBox.options.length;
for (var i = 0; i <= fieldLength; i++) {
var newOption = new Option(); // Create a new instance of ListItem
newOption.text = varFromBox.options[i].text;
newOption.value = varFromBox.options[i].value;
varToBox.options[varToBox.options.length] = newOption; //Append the item in Target Listbox

} //for
for (var i = 0; i <= fieldLength; i++) {
varFromBox.remove(i); //Remove the item from Source Listbox
}

}//test

[andrewsmd]

That for loop gives me the same problem as leaving the remove method in the original for. Do you have any other suggestions. I also tried this with the same result
var i = 0;
var len = varFromBox.options.length;
while(i < len){
varFromBox.remove(i); //Remove the item from Source Listbox
i++;
}//while

[andrewsmd]

I got it here it is

function moveSelections(bxFrom, bxTo) {

var varFromBox = document.getElementById(bxFrom);
var varToBox = document.getElementById(bxTo);

if (varFromBox.options.length < 1) {
alert('There are no items in that box');
return false;
} //if

for (var i = 0; i < varFromBox.options.length; ++i) {

var newOption = new Option(); // Create a new instance of ListItem
newOption.text = varFromBox.options[i].text;
newOption.value = varFromBox.options[i].value;
varToBox.options[varToBox.options.length] = newOption; //Append the item in Target Listbox

} //for

var i = 0;
var len = varFromBox.options.length;
while (varFromBox.options.length > 1) {

if (varFromBox.options.length = 1) {
varFromBox.remove(0); //Remove the item from Source Listbox
} //if length = 1
else {
varFromBox.remove(1);
} //else

}//while

}//moveSelections

Now my new question. I need to be able to see these selections on the server side. How would I go about doing that?