getSelectedRadioButton Index and Value

by Terrance Smith

HTML

<input type="Radio" name="grp1" value="Me1" />
<input type="Radio" name="grp1" value="Me2" />
<input type="Radio" name="grp1" value="Me3" />
<input type="Radio" name="grp1" value="Me4" />
<input type="button" value="click to change" onclick="doChange()" />

JavaScript

var getSelectedRadioButtonValue = function (btnGroupName) {
    var btnGrp = document.getElementsByName(btnGroupName);
    var btnGrpLength = btnGrp.length;
    var index = 0;
    var selectedRadioValue = 0;
    for (index = 0; index < btnGrpLength; index++) {
        if (btnGrp[index].checked === true) {
            selectedRadioValue = btnGrp[index].value;
            break;
        }
    }

    return selectedRadioValue;
};


var getSelectedRadioButtonIndex = function (btnGroupName) {
    var btnGrp = document.getElementsByName(btnGroupName);
    var btnGrpLength = btnGrp.length;
    var index = 0;
    var selectedIndex = -1;
    for (index = 0; index < btnGrpLength; index++) {
        if (btnGrp[index].checked === true) {
            selectedIndex = index;
            break;
        }
    }

    return selectedIndex;
};


function doChange() {
    alert(getSelectedRadioButtonValue("grp1"));
    alert(getSelectedRadioButtonIndex("grp1"));
}