Simple calculation not working

Question

I want to alert the total amount calculated but I don't know why instead of calculating its just appending the values.

The code:

    $('#main button').click(function(){
    id = $(this).attr('id');
    parts = id.split('_');
    item_id = parts[0];
    pairs = $('#'+item_id+'_pairs').val();
    females = $('#'+item_id + '_females').val();
    males = $('#'+item_id + '_males').val();
    if(pairs >0){
        counted_pairs = pairs*2;
    }else{
        counted_pairs = 0;
    }
    total_fishes = (males + females + counted_pairs);
    alert(total_fishes);
});

If I add 1 pair 1 male and 1 female in form it should show 4 total but its showing 111 seems appending not calculating?

`val` returns a string. You need to somehow cast the values to numbers. — Shmiddty, Dec 06 '12 at 22:42
Ways to convert a string to a number include `Number(string)`, `string*1`, `string+0`, `parseInt(string)`, `parseFloat(string)`, `string/1`, and probably other methods. — Shmiddty, Dec 06 '12 at 22:46
possible duplicate of [How do I Convert a String into an Integer in JavaScript?](http://stackoverflow.com/questions/1133770/how-do-i-convert-a-string-into-an-integer-in-javascript) — Shmiddty, Dec 06 '12 at 22:56
@Shmiddty: The best being `parseInt` or `parseFloat`, the most direct being a unary `+`. — T.J. Crowder, Dec 06 '12 at 22:57
But `+string` will work. Used like `pairs = +$('#'+item_id+'_pairs').val();` — Shmiddty, Dec 06 '12 at 22:58

score 5 · Answer 1 · answered Dec 06 '12 at 22:41

5

you need to do a numeric addition. What you have is a string concatenation.

Try converting it to a number using parseInt.

total_fishes = (parseInt(males, 10) + parseInt(females, 10) + counted_pairs);

Note: I haven't applied for counted_pairs as it will be a number because of counted_pairs = pairs*2;

answered Dec 06 '12 at 22:41

Selvakumar Arumugam

79,297
15
120
134

@user1494854: make sure that you use this on production. +1 – naveen Mar 03 '15 at 16:29

Guffa · Answer 2 · 2012-12-06T22:49:42.977

2

Parse the values to numbers when you get them:

pairs = parseInt($('#'+item_id+'_pairs').val(), 10);
females = parseInt($('#'+item_id + '_females').val(), 10);
males = parseInt($('#'+item_id + '_males').val(), 10);

Now, when pairs is a number, you don't have to check for the zero specifically, as 0 * 2 will calculate just fine:

counted_pairs = pairs * 2;

edited Dec 06 '12 at 22:49

answered Dec 06 '12 at 22:42

Guffa

687,336
108
737
1,005

Why the downvote? If you don't explain what you think is wrong, it can't improe the answer. – Guffa Dec 06 '12 at 22:44

score 2 · Answer 3 · answered Dec 06 '12 at 22:43

If one of the variables you are adding holds a string value, JavaScript will append the values with each other as if all are strings. Make sure all your variables hold integer values; otherwise convert them to integers by parsing as the other answers suggested.

score 2 · Answer 4 · edited Dec 06 '12 at 23:08

2

Convert your values to integers before your if statement...

pairs = parseInt($('#'+item_id+'_pairs').val(), 10);

females = parseInt($('#'+item_id + '_females').val(), 10);

males = parseInt($('#'+item_id + '_males').val(), 10);

edited Dec 06 '12 at 23:08

Linuxios

34,849
13
91
116

answered Dec 06 '12 at 22:45

Richard Markette

41
4

I think this is same as what [Guffa](http://stackoverflow.com/a/13753962/297641) has answered. – Selvakumar Arumugam Dec 06 '12 at 22:45
Yes it is, he posted his answer while I was writing mine. When I submitted mine, the page refreshed and then I saw his. – Richard Markette Dec 07 '12 at 13:44

KingKongFrog · Answer 5 · 2012-12-06T22:55:46.923

1

You are concatenating strings, not adding values. Use parseFloat or parseInt to add numbers.

total_fishes = (parseFloat(males) + parseFloat(females) + parseFloat(counted_pairs));

edited Dec 06 '12 at 22:55

answered Dec 06 '12 at 22:41

KingKongFrog

13,946
21
75
124

Dillen Meijboom · Accepted Answer · 2012-12-06T22:59:05.970

0

Change total_fishes = (males + females + counted_pairs); to this:

total_fishes = ((males * 1 + females * 1) * 1 + counted_pairs * 1);

This will work, I know it seems odd but Javascript converts the variables to numbers when u use * 1 + value * 1. I can't explain why but I saw this peace of code a couple of years ago in cPanel x and I use it a lot.

Edit:

There is actually a difference when you are using user input you can check if the value is wrong using isNaN this will not work when you use parseInt because it supresses the error and tries to create an integer anyways.

TestCode:

var males = "2,4";
var females = "3";
var counted_pairs = "33";

var result = ((males * 1 + females * 1) * 1 + counted_pairs * 1);
var resultb = (parseInt(males) + parseInt(females * 1) + parseInt(counted_pairs));

if (isNaN(result)) {
 alert("Input is wrong my method");   
}

if (isNaN(resultb)) {
 alert("Input is wrong using parseint");   
}

Result: Only the first alert screen will be shown.

edited Dec 06 '12 at 22:59

answered Dec 06 '12 at 22:40

Dillen Meijboom

963
7
13

2

There is **zero** reason to throw multiplication into this. – T.J. Crowder Dec 06 '12 at 22:41
@T.J.Crowder it's shorthand to convert a string to a number. – Shmiddty Dec 06 '12 at 22:43
@Vega: It's a *bad* trick to convert to number. `parseInt` or `parseFloat` are better, as they let you control the number base used so you don't get unexpected results. At the *very* least, if you insist on leaving yourself open to those unexpected results, use a unary `+` or `Number(str)` rather than multiplication. – T.J. Crowder Dec 06 '12 at 22:53
also this should not be the accepted answer as `parseInt` without radix also gives unexpected errors – naveen Mar 03 '15 at 16:27

Simple calculation not working

6 Answers6