Acn
Acn

Reputation: 1066

Accessing HTML Form elements through Javascript

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.

Upvotes: 0

Views: 136

Answers (2)

Cᴏʀʏ
Cᴏʀʏ

Reputation: 107626

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;

Upvotes: 2

Blender
Blender

Reputation: 298582

For checkbox, the element has a .checked property:

document.getElementById('foo').checked; // true or false

Upvotes: 1

Related Questions