Created:10/1999; Updated:12/2001

Setting Dropdown Focus

Question:

I have a long multiple select box of items that appear on a page. Depending on a users settings, one (or more) of those items may be selected when they get to the page.

What I am trying to do, is focus the list of items so that the first selected item is at the top of the select box. As an example, if you have a list of 30 items, and only 7 can show at a time, and the 20th item is selected, I would like it (#20) to be at the top of the select box, with the scroll bar set appropriately on the page.

I tried to use document.form.name.option[index].focus() but, focus() is not supported... So, any and all suggestions would be appreicated.

Update 12/2001:Bernd Brandt writes:

NS 4.78 on UNIX has different select multiple layout. Also CTRL and SHIFT do not work. It does not thow an error, but the menuscrollbar simply does not scroll down with the selectedIndex. The selection is made however. Also Mozilla (Unix) and NS 6 for UNIX work ok with your script. These browser use a select-multiple layout as IE (and CTRL and SHIFT work as well).

ANSWER: focus is the right idea - but for a select box there's an easier way - the "selectedIndex" property of a <SELECT> element. Use that instead.

The links below have onMouseover events which call a function selSELECT and pass the numbers to select which option we want selected.

0 1 2 3
4 5 6 7

Source Code

<script language="JavaScript" type="text/javascript">
<!--
function selSELECT(which) {
/*
   Script by Joe Crawford http://www.artlung.com/
*/
document.forms[0].mySelectBox.selectedIndex = which;
}
//-->
</script>