Question

Can any guru show me how to get values from HTML Form element – RADIO BUTTON and CHECK BOX?

For example in case of text box we can get the value directly by getElementById(id).value;

But how to get the value for a combo box (drop down menu), radio button and checkbox ?

Thanks.

Answer 1

Drop down (<select>):

var el = document.getElementById('yourSelectId');
var value = el.options[el.selectedIndex].value;

If you’re treating your select list as a multi-select (combobox) list, you have to loop through the options and check if they are selected:

var el = document.getElementByid('yourSelectId');
var selectedValues = [];

for (var i = 0; i < el.options.length; i++) {
    if (el.options[i].selected) {
        selectedValues.push(el.options[i].value);
    }
}

// all selected values are now in the selectedValues array.

Radio buttons and checkboxes should also have value properties, but more appropriately I think I would only test whether they are checked:

var isChecked = document.getElementById('yourRadioOrCheckboxId').checked;