JS Basics: How to use if/else inside a function and set to variable

Question

I'm a JavaScript total beginner and I've gotten stuck on something that seems like it should work while trying to set a variable with a an if/else condition inside and anonymous function. Here is my code:

function changeValue(){
  var newValue = (function(){
    var getRadioValue = $( "input:radio[name=Radio1]:checked" ).val();
      if (getRadioValue === 5){
         var final = 8;
      }
      else if (getRadioValue === 4){
         var final = 5;
      }
      else if (getRadioValue === 3){
         var final = 3;
      }
      else if (getRadioValue === 2){
         var final = 1;
      }
      else if (getRadioValue === 1){
         var final = -1;
      }
      else 
      {
         var final = 0;
      }
      return final;
    })();

  alert(newValue);
}

Right now, the alert is showing 0 because none of the "ifs" are returning true, but if I set the getRadioValue variable hard coded like:

var getRadioValue = 5;

then the if/else conditional works and the alert message shows 8. That makes it seem like the .val() method isn't working. However, if I simply set the alert to:

alert(getRadioValue);

The alert message does in fact display the correctly selected radio value from the radio button set on my page. So I know that is working... Now I can't figure out where I'm going wrong. It seems like since the radio value is getting assigned to getRadioValue correctly, and the conditional is working, the whole thing should work. I'm sure it's such a basic problem, but after much research I still can't seem to get it. Any help is greatly appreciated!

I would reccomend taking a look at http://stackoverflow.com/questions/359494/does-it-matter-which-equals-operator-vs-i-use-in-javascript-comparisons , as some answers have noted, `===` is your problem. — Eric Phillips, Dec 06 '15 at 00:37
Have you tested your if statements with == value equal operator ? You are using type and value comparator operator. — RockOnGom, Dec 06 '15 at 00:40

CoderPi · Accepted Answer · 2015-12-06T00:40:12.323

3

.val() is returning a string but you are testing for number if (getRadioValue === 5){.

You might want to do getRadioValue = parseInt(getRadioValue) first.

Demo:

getRadioValue = parseInt("5")

var final = 0; // use var once, its cleaner ;)
if (getRadioValue === 5) {
  final = 8;
} else if (getRadioValue === 4) {
  final = 5;
} else if (getRadioValue === 3) {
  final = 3;
} else if (getRadioValue === 2) {
  final = 1;
} else if (getRadioValue === 1) {
  final = -1;
}

alert(final);

edited Dec 06 '15 at 00:40

answered Dec 06 '15 at 00:34

CoderPi

12,985
4
34
62

Yes, it worked. Thank you! I will post my final code below. – Sol Dec 06 '15 at 00:39
Nice! To keep your code clean, you might want to put `var final = 0;` infront, as you can see in the updated demo – CoderPi Dec 06 '15 at 00:41
1

He could also use the less strict == equality check. – BAM5 Dec 06 '15 at 00:48
Yes I forgot to mention that. But for user input he should get used to parseInt – CoderPi Dec 06 '15 at 00:50

score 0 · Answer 2 · answered Dec 06 '15 at 00:41

Thanks to CodeiSir! That was the issue. Here is my final working code for others who might run into a similar problem:

function changeValue(){
 var newValue = (function(){
   var getRadioValue = $( "input:radio[name=CalcItem1]:checked" ).val();
   var RadioValue = parseInt(getRadioValue);
      if (RadioValue === 5){
         var final = 8;
      }
      else if (RadioValue === 4){
         var final = 5;
      }
      else if (RadioValue === 3){
         var final = 3;
      }
      else if (RadioValue === 2){
         var final = 1;
      }
      else if (RadioValue === 1){
         var final = -1;
      }
      else 
      {
         var final = 0;
      }
      return final;
    })();

alert(newValue);
}

JS Basics: How to use if/else inside a function and set to variable

2 Answers2