adding two numbers in javascript

Question

I am trying to add these two numbers for an hour and can't get the result in the third text field. Please help me achieve this. thank you. also please tell me is there any add() method in javascript?

<!DOCTYPE html>
<html>
<head>
    <title>test</title>
<style type="text/css">
    #cal{
        border:3px solid green;
        padding: 5px;
        width:250px;
        text-align: center;
    }

</style>
</head>

<body>
    <button onclick="add()" id="button">Add</button>
    <div id="cal">
    <input type="text" value=" " id="num1" size="5">
    +
    <input type="text" value=" " id="num2" size="5">
    =
    <input type="text" value=" " id="sum" size="5"> 
    </div>
<script>
        function add()
    {
        var a = document.getElementById("num1").value;
        var b = document.getElementById("num2").value;
        var ans =  a + b ;
        document.getElementById("sum").value = ans;
    }
</script>

</body>
</html>

they aren't numbers they are strings until you convert to number. There are a wide variety of ways to convert. — charlietfl
– charlietfl, Commented Dec 21, 2014 at 19:04
That's what I call a typical JavaScript beginner problem. Don't worry, every JS developer had this problem once. — maja
– maja, Commented Dec 21, 2014 at 19:04

Adam Cherti · Accepted Answer · 2014-12-21 19:03:41Z

1

The input values are strings not numbers. You have to convert them to numbers with the function parseInt() for integers or parseFloat() if they happen to be decimal numbers :

var a = parseFloat(document.getElementById("num1").value);
var b = parseFloat(document.getElementById("num2").value);
var ans = a + b;
document.getElementById("sum").value = ans;

answered Dec 21, 2014 at 19:03

Adam Cherti

9821 gold badge8 silver badges21 bronze badges

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

5 Comments

charlietfl Over a year ago

what if they are decimal?

Adam Cherti Over a year ago

You use parseFloat instead of parseInt

David Thomas Over a year ago

You left out the radix; was that deliberate?

charlietfl Over a year ago

@Teemu that comment was made when answer was using parseInt

David Thomas Over a year ago

@Teemu: no, but parseInt() does; which was used in the original answer (edited in the grace period).

Community · Accepted Answer · 2020-06-20 09:12:55Z

1

Check this `demo`

Use JavaScript Number() Function

function add(){
    var a = document.getElementById("num1").value;
    var b = document.getElementById("num2").value;
    var ans =  Number(a) + Number(b) ;
    document.getElementById("sum").value = ans;
}

edited Jun 20, 2020 at 9:12

CommunityBot

11 silver badge

answered Dec 21, 2014 at 19:05

Jaykumar Patel

27.7k12 gold badges79 silver badges76 bronze badges

Collectives™ on Stack Overflow

adding two numbers in javascript

2 Answers 2

5 Comments

Check this `demo`

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

Check this demo

Comments

Your Answer

Sign up or log in

Post as a guest

Related

Check this `demo`