Select boxes and repositioning

[briwest1]

I have been all over the internet and cannot find an answer to this question. So huge kudos to anyone who can help me figure this one out.

I have a standard HTML select box with a list of about 50 options (we'll call box A). When I select several options and click a button, they get moved to another box (we'll call box B). Now when this happens box A automatically scrolls back up to the top of the list. What I want to happen is when those options are moved I want box a to stay in the same position instead of scrolling back up to option 1.

Can anyone help?

[Webskater]

This is easy to do - but your question is a bit vague as you have not posted any code. Are you using javascript to take the values selected in box a and populating box b? Or submitting a form each time?
Anyway, all you need to do is remember the value that you want box A to stay at and then loop through the list populating box A until the values match and make this the selected option. If you post some code I can show you what I mean.

[briwest1]

I understand your answer. although this does select the option value, it does not position the select box on it. For example, looking at the select box below, if I would select option 18 and move it, the next option would end up being selected but the box will reposition back to option 1. I hope I'm being clear enough so let me know if you need a better example. Here is the code you requested.

Here is select box A:

<select name="select" size="5" >
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
.
.
.
<option value="24">Option 24</option>
<option value="25">Option 25</option>
</select>

the javascript code to loop through is the following:

// fbox being box A
// tbox bing box B

fboxIndexHold = fbox.selectedIndex;

for(var i=0; i<fbox.options.length; i++) {
if(fbox.options.selected && fbox.options[i].value != "") {
var no = new Option();
no.value = fbox.options[i].value;
no.text = fbox.options[i].text;
no.style.color = fbox.options[i].style.color;
if (tbox.options[0].value == '-999') {
tbox.options[0] = no;
} else {
tbox.options[tbox.options.length] = no;
}
fbox.options[i].value = "";
fbox.options[i].text = "";
}
}

// Assign Previous index as the selected attribute
fbox.options[fboxIndexHold].selected = true;
fbox.focus();

// I've also tried:
fbox.options[fboxIndexHold].scrollIntoView();
fbox.options[fboxIndexHold].scrollIntoView();[I]select

[briwest1]

Bumping this...still hoping for an answer.

[khalidali63]

Is it possible for you to zip your complete html/javascript code and upload it here.It will be easy to make sense of what you want while looking at the code in question.or email it to me

k_ali@shaw.ca

cheers

Khalid