Question

I have a couple select elements:

<select name="empID" onchange='setSupervisor(this);'>
    <option value="111" sid="222">Eric Employee</option>
    ...
</select>

<select name="supervisorID">
    <option value="333">Susie Supervisor</option>
    <option value="222">Stan Supervisor</option>
</select>

And a javascript function:

function setSupervisor(sender)
{
    ??
}

How can I set the supervisor dropdown after the user selects from the employee dropdown? The tricky part here (at least to me) is having to use a custom sid and not the value from the employee dropdown.

Answer 1

function setSupervisor(sender) {
    var selectedOption = sender.getElementsByTagName("option")[sender.selectedIndex];
    var sid = selectedOption.getAttribute("sid");

    var supervisorSelect = document.getElementsByName("supervisorID")[0];
    for (var i = 0, len = supervisorSelect.options.length, option; i < len; ++i) {
        option = supervisorSelect.options[i];
        if (option.value == sid) {
            option.selected = true;
            return;
        }
    }
}