Q897 How can I synchronize select form fields so that they all display the same entries when one is changed, but where the synchronized select form fields are not actually selected?

You can have three select boxes, where selecting an option in one selects the corresponding ones in another. The synchorization might be possible by selecting and then unselecting the options but might not work on all browsers:

<script language="JavaScript"><!--
function set(i,option,bool) {
    document.myForm.elements['select' + i].options[option].selected = bool;
}

function synchronize(what,number) {
    option = what.elements['select' + number].selectedIndex;
    for (var i = 0; i<3; i++) {
        if (number != i) {
            set(i,option,true);
            eval('setTimeout("set(' + i + ',' + option + ',false)",1)');
        }
    }
}
//--></script>

<form name="myForm">

<select name="select0" onChange="synchronize(this.form,0)">
<option>0
<option>1
<option>2
<option>3
<option>4
<option>5
</select>

<select name="select1" onChange="synchronize(this.form,1)">
<option>0
<option>1
<option>2
<option>3
<option>4
<option>5
</select>

<select name="select2" onChange="synchronize(this.form,2)">
<option>0
<option>1
<option>2
<option>3
<option>4
<option>5
</select>

</form>

Which seems to work on Netscape Navigator 4.5 on Linux.

The addition of the following button highlights the selected/unselected options as having a selectedIndex of -1:

<input type="button" value="Show" onClick="alert(this.form.select0.selectedIndex + ' ' + this.form.select1.selectedIndex + ' ' + this.form.select2.selectedIndex)">