Add two variable in javascript having numeric value

Question

I am making a program to add 10% in a value entered by user with java script.

my HTML code

<input id='new' onKeyUp='doit()' name='hello' onkeydown='doit()' value=''  placeholder='Type a numeric value' />
<input id='new1' value=''  placeholder='final value' />

my java script code

<script>
function doit()
{
var sum=document.getElementById('new').value;
var extra=sum/10;
var newamount=sum + extra;
document.getElementById('new1').value=newamount;
}
</script>

js.do output

on giving input 100 expected output is 110 but actual output comming is 10010

Although i am adding according to rule.... w3schools example

Please tell me where i am wrong.......................

It is because of it is treating sum value as a string so when you are trying to add it is just concatenating the values. Convert the value into Number and then try to add .Then It will give the expected outpurt — Suresh
– Suresh, Commented Sep 1, 2015 at 6:02

Joy Biswas · Accepted Answer · 2015-09-01 05:47:13Z

Actually the document.getElementById('input_element').value will return a string. In a mathematical expression in JS operations such as / * - will be fine eg Mathematical but the + actually concatenates string for c = a + b if any of the a or b is a string c will be the concatenated value else if both a and b are numbers c will be addition of both numbers . To avoid either do a parseInt() or multiply by 1 before adding to another number. I have added a *1 to var newamount=sum*1 + extra; You can also use var newamount=parseInt(sum) + extra;

Snippet Added below:

function doit()
{
  var sum=document.getElementById('new').value;
  var extra=sum/10;
  var newamount=sum*1 + extra;
  document.getElementById('new1').value=newamount;
}

<input id='new' onKeyUp='doit()' name='hello' onkeydown='doit()' value=''  placeholder='Type a numeric value' />
<input id='new1' value=''  placeholder='final value' />

Rahul Tripathi · Accepted Answer · 2015-09-01 05:38:59Z

2

Try this:

function doit()
{
var sum=document.getElementById('new').value;
var extra=parseInt(sum)/10;
var newamount=parseInt(sum) + extra;
document.getElementById('new1').value=newamount;
}

answered Sep 1, 2015 at 5:38

Rahul Tripathi

173k33 gold badges292 silver badges341 bronze badges

Comments

sajanyamaha · Accepted Answer · 2015-09-01 05:41:04Z

0

DO parseInt()

var newamount=parseInt(sum) + parseInt(extra);

answered Sep 1, 2015 at 5:41

sajanyamaha

3,2063 gold badges32 silver badges47 bronze badges

Comments

venkat7668 · Accepted Answer · 2015-09-01 05:41:16Z

0

use parseInt js.do

function doit()
{
   var sum=document.getElementById('new').value;
   var extra=sum/10;
   var newamount=parseInt(sum) + extra;
   document.getElementById('new1').value=newamount;
}

answered Sep 1, 2015 at 5:41

venkat7668

2,7971 gold badge24 silver badges28 bronze badges

Comments

Moishe Lipsker · Accepted Answer · 2015-09-01 05:41:27Z

0

Use the parseInt function to turn sum into a number so that sum + extra will not concatenate the two, but will add them numerically.

var sum = parseInt(document.getElementById('new').value);

answered Sep 1, 2015 at 5:41

Moishe Lipsker

3,0322 gold badges23 silver badges29 bronze badges

Comments

Rajesh kannan · Accepted Answer · 2015-09-01 05:42:50Z

0

use parseIntin Javascript.

I'm re writing your code with parseInt.

function doit()
{
var sum=document.getElementById('new').value;
var extra=parseInt(sum)/10;
var newamount=parseInt(sum) + parseInt(extra);
document.getElementById('new1').value=newamount;
}

Let me know if it is helpful

answered Sep 1, 2015 at 5:42

Rajesh kannan

6343 silver badges16 bronze badges

Comments

Mukesh Singh Rathaur · Accepted Answer · 2015-09-01 05:46:51Z

0

document.getElementById('textId').value

Return A String, representing the value of the text field but not the Fixnum/Numeric type. So before you apply any arithmetic you have to convert it to numeric type.

More details pls refer Input Text value Property on w3schools

answered Sep 1, 2015 at 5:46

Mukesh Singh Rathaur

13.2k2 gold badges25 silver badges24 bronze badges

Comments

Hope · Accepted Answer · 2015-09-01 05:48:45Z

0

Use parseFloat() instead of parseInt() because parseInt only output whole number. Try this...

<input id='new' onKeyUp='doit()' name='hello' onkeydown='doit()' value=''  placeholder='Type a numeric value' />
<input id='new1' value=''  placeholder='final value' />
<script>
function doit()
{
var sum=parseFloat(document.getElementById('new').value);
var extra=sum/10;
var newamount=sum + extra;
document.getElementById('new1').value=newamount;
}
</script>

answered Sep 1, 2015 at 5:48

Hope

6442 gold badges7 silver badges22 bronze badges

Comments

Ian Yockey · Accepted Answer · 2019-01-30 00:40:36Z

0

and if you are using numbers like 57.435 you can use parseFloat(sum)

answered Jan 30, 2019 at 0:40

Ian Yockey

1

1 Comment

Kingsley Over a year ago

Do you mean var sum = parseFloat( document.getElementById('new').value );

Collectives™ on Stack Overflow

Add two variable in javascript having numeric value

9 Answers 9

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

9 Answers 9

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related