Why my javascript program is not converting it to integer rather than string?

Question

i have created a simple program in which it needs to add 1 and 3 and show 4 but it shows me 13 here is my program:

<html>
    <head>
        <style>
        </style>
        <script type="text/javascript">
        function calculate(){

            a = document.getElementById('num1').value;
            b = document.getElementById('num2').value;
            document.getElementById('result').innerHTML = a + b;
        }
        </script>
    </head>
    <body>
        <input id='num1' value="1"/>
        <input id='num2' value='3'/>
        <p id='result'></p>
        <button onclick="calculate()">Calculate</button>
    </body>
</html>

What do i do now?

It would be evident that your code is concatenating two variables rather than adding as intended. Concatenation is an operation performed on string objects, whereas addition is an operation performed on numeric objects. What do you think needs to happen for both string variables to treat them as numeric? — Anthony Forloney
– Anthony Forloney, Commented Apr 5, 2015 at 15:20
i recomend to declare your varibles after assigning a value, i mean: var a = ... — xsami
– xsami, Commented Apr 5, 2015 at 15:26

Amit Joki · Accepted Answer · 2015-04-05 15:21:02Z

2

That's because value attribute returns a String. You need to convert it to a Number.

There's a shortcut though, by using + unary operator. You can also wrap the string in Number like Number(a) + Number(b).

a = +document.getElementById('num1').value;
b = +document.getElementById('num2').value;

answered Apr 5, 2015 at 15:21

Amit Joki

59.4k7 gold badges80 silver badges96 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Sohel · Accepted Answer · 2015-04-05 15:20:24Z

2

You have to convert to integer. Check out this code.

    function calculate(){

        a = parseInt(document.getElementById('num1').value, 10);
        b = parseInt(document.getElementById('num2').value, 10);
        document.getElementById('result').innerHTML = a + b;
    }

answered Apr 5, 2015 at 15:20

Sohel

4313 silver badges10 bronze badges

Comments

xsami · Accepted Answer · 2015-04-05 15:25:50Z

1

Try doing this:

document.getElementById('result').innerHTML =  parseInt(a) + parseInt(b);

The reason is because you a and b are strings and you need first to convert then to numbers.

answered Apr 5, 2015 at 15:25

xsami

1,32816 silver badges32 bronze badges

1 Comment

Amit Joki Over a year ago

It's a bad idea to ignore the radix.

Collectives™ on Stack Overflow

Why my javascript program is not converting it to integer rather than string?

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related