Question

The below code doesn’t it print the value.

function go(x)
{
   alert(x.options.selectedIndex.value);
   //location=document.menu.student.options[document.menu.student.selectedIndex].value
}

this is the html code

<select name="student" onChange="go(this)">
    <option selected> Student </option>
    <option value="http://www.cnet.com">Attendence</option>
    <option value="http://www.abc.com">Exams</option>
</select>

Answer 1

selectedIndex is a number, it doesn’t have a value property.

If you have a select element which just allows single-select (as yours does), the easiest way to get its value is the select element’s value property:

function go(x) {
    alert(x.value);
}

Double-check that it works on the browsers you want to support, but MaryAnne (see the comments) has checked on all current major browsers and I’ve checked IE6, IE7, and Firefox 3.6 (e.g., older browsers), and they all work. Since it’s specified in DOM2 HTML (the link above)…

But re selectedIndex, you probably meant:

function go(x) {
    alert(x.options[x.selectedIndex].value);
}

I’d probably take it a bit further and be more defensive:

function go(x) {
    var option = x.options[x.selectedIndex];
    if (option) {
        alert(option.value);
    }
}

…or

function go(x) {
    var option = x.options[x.selectedIndex];
    var value = option && option.value;
    alert(value); // Alerts "undefined" if nothing is selected
}

…in case there is no selected option (in which case, option will be undefined), although with your particular markup and code, I’m not aware of a user agent where the change event would be fired without there being anything selected. At least, I don’t think so — “I think” being the reason for being defensive. 🙂