Add Variables In If Statement From Values Determined by Radio Buttons

Question

I have a short survey that gives a final value based on the selections you make. The problem is, only the first radio group, "people" is being added at the end... the other four (org + focal + location + carry) are being ignored. Would someone please help me figure out what is wrong with my code? Thanks!

var score = 0;

var people = 0;
var org = 0;
var focal = 0;
var location = 0;
var carry = 0;

//PEOPLE
if ($('input:radio:checked').val() === "Obama") {
    people = -25;
}else if ($('input:radio:checked').val() === "Clinton"){
    people = -15;
}else if($('input:radio:checked').val() === "Bush"){
    people = 25;
}else if($('input:radio:checked').val() === "Romney"){
    people = 0;
}else if($('input:radio:checked').val() === "Windsor"){
    people = 25;
}else if($('input:radio:checked').val() === "Putin"){
    people = -25;
};

//ORG
if ($('input:radio:checked').val() === "Christian") {
    org = 20;
}else if ($('input:radio:checked').val() === "Boy Scouts"){
    org = 10;
}else if($('input:radio:checked').val() === "Freemason"){
    org = 30;
}else if($('input:radio:checked').val() === "KGB"){
    org = -20;
}else if($('input:radio:checked').val() === "Islam"){
    org = -30;
}else if($('input:radio:checked').val() === "Satanic Cult"){
    org = -50;
};


//FOCAL
if ($('input:radio:checked').val() === "Financial") {
    focal = 15;
}else if ($('input:radio:checked').val() === "Industry"){
    focal = 20;
}else if($('input:radio:checked').val() === "Medical"){
    focal = 5;
}else if($('input:radio:checked').val() === "Technology"){
    focal = 30;
}else if($('input:radio:checked').val() === "War"){
    focal = -30;
}else if($('input:radio:checked').val() === "Spy"){
    focal = -20;
};

//LOCATION
if ($('input:radio:checked').val() === "United Kingdom") {
    location = 5;
}else if ($('input:radio:checked').val() === "U.S.A."){
    location = -15;
}else if($('input:radio:checked').val() === "China"){
    location = 0;
}else if($('input:radio:checked').val() === "Germany"){
    location = 20;
}else if($('input:radio:checked').val() === "Russia"){
    location = -40;
}else if($('input:radio:checked').val() === "Mexico"){
    location = -60;
};

//CARRY
if ($('input:radio:checked').val() === "Tune") {
    var carry = 15;
}else if ($('input:radio:checked').val() === "Weight"){
    var carry = 25;
}else if($('input:radio:checked').val() === "Stick"){
    var carry = 0;
}else if($('input:radio:checked').val() === "Grudge"){
    var carry = -25;
}else if($('input:radio:checked').val() === "Ebola"){
    var carry = -80;
}else if($('input:radio:checked').val() === "Reset"){
    var carry = -100;
};

var score = (people + org + focal + location + carry);

if(score>50){
    $('.result').html('You Win!');
}else{
    $('.result').html('You Lose!');
}

$('p').html("Your score is " + score + ".");

Answer 1

The problem is your radio selector, it will always return the very first checked radio value across all the groups instead of targeting specific groups.

The solution is to use the radio group name in the selector like $('input[name="people"]:radio:checked').val() .

To add to that, you can simplify the code by using a value map like

var pmap = {
    Obama: -25,
    Clinton: -15,
    Bush: 25,
    Romney: 0,
    Windsor: 25,
    Putin: -25
};

var people = pmap[$('input[name="people"]:radio:checked').val()] || 0;

Create similar value maps for the other groups also.