CODEWITHSUNDEEP
javascriptradio-button
UniWorld
UniWorld

Reputation: 31

radio button checked javascript - no jquery

below function seems to be not working..

function myCalculator () {

    var operator = document.getElementsByName("operator");
    var output = document.getElementById("output");
    var firstDig = parseInt(document.getElementById("firstDig").value);
    var secondDig = parseInt(document.getElementById("secondDig").value);   

    for (var i=0; i<operator.length; i++){

        var currentOperator = operator[i].id;

        if(currentOperator.checked == "Add"){
            var add = firstDig + secondDig;
                output = add;
        };


    };

        }

somehow the "if" parameter is returning false but, i got the element with the property checked...im making a simple calculator...below is the html...

<fieldset>

    <label>Enter Number:</label>
    <input type="text" id="firstDig" />
    <input type="text" id="secondDig" />
        <br/> <br/>
    <label>Select Operator:</label>
    <br/><br />

    <input type="radio" id="Add" name="operator" checked="checked" />
        <label for = "Add">Add</label>

    <input type="radio" id="Subt" name="operator" />
        <label for = "Subt">Subtract</label>

    <input type="radio" id="Divi" name="operator" />
        <label for = "Divi">Divide</label>

    <input type="radio" id="Multi" name="operator" />
        <label for = "Multi">Multiply</label>

</fieldset>


<fieldset>
    <p>RESULT</p>
    <input type="text" id="output" />
    <button type="button" onclick="myCalculator()">Calculate</button>
</fieldset>

im still learning the foundations of javascript so im not that inetrested in jquery at the moment...all answers are appreciated...thanks

Upvotes: 3

Views: 961

Answers (4)

Arun P Johny
Arun P Johny

Reputation: 388316

checked property will have the value true/false, so you need to get the checked radio and then see whether its id is Add(You don't have value assigned to the radio elements instead they have id).

In the same way output is a input element, so you need to assign its value

function myCalculator() {

    var operator = document.getElementsByName("operator");
    var output = document.getElementById("output");
    var firstDig = parseInt(document.getElementById("firstDig").value);
    var secondDig = parseInt(document.getElementById("secondDig").value);

    for (var i = 0; i < operator.length; i++) {

        var currentOperator = operator[i],
            result = '';

        if (currentOperator.checked) {
            if (currentOperator.id == "Add") {
                result = firstDig + secondDig;
            } else if (currentOperator.id == "Subt") {
                result = firstDig - secondDig;
            }
            output.value = result;
        };


    };

}

Upvotes: 3

UniWorld
UniWorld

Reputation: 31

for (var i=0; i<operand.length; i++){
var currentOperand = operand[i];
if (currentOperand.checked && currentOperand.id == "Add") {
var add = firstDig + secondDig;
output.value = add;
}else if (currentOperand,checked && currentOperand.id == "Subt"){
var subt = firstDig - secondDig;
output.value = subt;
};

i have extended my if statement with an else if and it stopped working...thought i had it

Upvotes: 0

user3118180
user3118180

Reputation:

change output = add; to output.value = add;

Upvotes: 0

Zee
Zee

Reputation: 8488

if(currentOperator.checked == "Add"){..

is wrong. It can only have 2 values true or false. you can check it like:

if(currentOperator == "Add" && operator[i].checked){..

Also output = add;

shud be 

 output.value = add;

Upvotes: 1

Related Questions