Javascript, variables and if/else statements

Question

I'm a complete Javascript newbie and I'm helping my friend with a small project for college.

The idea is that when a checkbox is checked an item is chosen, and then when a "total" button is pressed, the sum of the checked items is printed. I've been using if/else statements so if checked var staticprice = 29.00 and else var staticprice = 0.00, which appears to work fine until I total it. Adding the variable "staticprice" always returns a value of 0.00, even when checked.

It's very messy (as is my first attempt creating something like this): http://jsfiddle.net/mNmQs/180/

What am I missing here?

Cheers

-1 because searching SO witn 'Javascript, variables and if/else statements' gives me 1'840 results!! — Daniel Gasser
– Daniel Gasser, Commented May 13, 2014 at 17:12

tymeJV · Accepted Answer · 2014-05-13 17:15:24Z

3

Couple of things to make life easier, give your checkboxes a value, that is what it's there for! I've updated your fiddle to include the appropriate values per checkbox. The next is loops, simply loop your checkboxes, if checked, add the value of the checked input to the total:

var totalBtn = document.getElementById("total"),
checkboxes = document.getElementsByTagName("input");

totalBtn.onclick = function() {
    var total = 0;
    for (var i = 0; i < checkboxes.length; i++) {
        if (checkboxes[i].checked) {
            total = total + parseInt(checkboxes[i].value);
        }
    }

    alert(total);
}

http://jsfiddle.net/mNmQs/181/

answered May 13, 2014 at 17:15

tymeJV

105k14 gold badges165 silver badges158 bronze badges

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

2 Comments

Jason Sperske Over a year ago

Slightly updated demo: jsfiddle.net/mNmQs/182 to show how to render the int total the same way as the original question

st_JM Over a year ago

Thankyou to these comments! You really helped me out! I merged the two to get this which does exactly what I want it to! jsfiddle.net/mNmQs/185

DarkAjax · Accepted Answer · 2014-05-13 17:22:11Z

2

You could change this line:

this.grandTotal= +seaprice + +stillprice + +staticprice;

To:

grandTotal= parseInt(seaprice,10) + parseInt(stillprice,10) + parseInt(staticprice,10);

In this case the problem is that you're trying to sum strings instead of numbers

JSFiddle example

HOWEVER it seems in this case there's no point in declaring your prices as strings. Of course unless you wanted to show the prices with in the format 0.00, otherwise just declare them as numbers and that should be better, like: var seaprice = 39.00; or var seaprice = 39.00; instead of var seaprice = "39.00";

Other fiddle

edited May 13, 2014 at 17:22

answered May 13, 2014 at 17:15

DarkAjax

16.3k11 gold badges60 silver badges67 bronze badges

2 Comments

Snuffleupagus Over a year ago

Wouldn't it make a lot more sense to declare them as ints instead of parsing them?

DarkAjax Over a year ago

@ElatedOwl It makes more sense unless the OP wants to show the prices like X.XX instead of just X...

Collectives™ on Stack Overflow

Javascript, variables and if/else statements

2 Answers 2

2 Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related