CODEWITHSUNDEEP
javascript
aleksXPO
aleksXPO

Reputation: 123

how to subtract a value if the checkbox in un-checked

I made a function for a calculation (game stats calculator) and it work fine but when i uncheck the value it doesn't subtract the value that it added by checking the box ,i know the code looks a little ugly but i am a beginner in JS:

function MC () {
check=document.getElementById('check').checked;


if(check){

    var hp=Number(document.form.hp.value),
        sp=Number(document.form.sp.value),
        ea=Number(document.form.ea.value),
        ed=Number(document.form.ed.value),
        pa=Number(document.form.pa.value),
        pd=Number(document.form.pd.value);

    var hpSum = 0,spSum=0,eaSum=0,edSum=0,pdSum=0,paSum=0;

    eaSum = ea + 11;
    edSum = ed + 17;
    pdSum = pd + 17;
    paSum = pa + 11;


    document.form.ea.value=eaSum;
    document.form.ed.value=edSum;
    document.form.pa.value=paSum;
    document.form.pd.value=pdSum;
} 

if(check == false){
    eaSum = ea - 11;
    edSum = ed - 17;
    pdSum = pd - 17;
    paSum = pa - 11;

    document.form.ea.value=eaSum;
    document.form.ed.value=edSum;
    document.form.pa.value=paSum;
    document.form.pd.value=pdSum;

    }
};

It returns when i uncheck NaN(but it should be a number).Also please not that MC should be one item i just did the initialization there because i needed it for this example.

Upvotes: 1

Views: 241

Answers (2)

ZER0
ZER0

Reputation: 25322

Because you assign the value of your variables only if check is true. You have to put them out the if statement:

function MC () {
   // user `var`! Otherwise you're polluting the global scope
   var checked = document.getElementById('check').checked;

   // if it's checked then the `sign` is +, otherwise -.
   var sign = ~-(checked << 1);

   // don't repeat yourself, and cache `form` for a faster access.
   // I assume from your code that `form` is the name of your form, so:
   var form = document.forms["form"]; // reduce ambiguity

   // Unary plus operator: 
   // https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Operators/Arithmetic_Operators
   var ea = +form.ea.value;
   var ed = +form.ed.value;
   var pa = +form.pa.value;
   var pd = +form.pd.value;
   // I removed `hp` and `sp` because not used

   // the multiplication operator takes the precedence
   var eaSum = ea + 11 * sign;
   var edSum = ed + 17 * sign;
   var pdSum = pd + 17 * sign;
   var paSum = pa + 11 * sign;

   // set the values back
   form.ea.value = eaSum;
   form.ed.value = edSum;
   form.pa.value = paSum;
   form.pd.value = pdSum;
};

Upvotes: 0

Eineki
Eineki

Reputation: 14909

I would try something like this:

function MC () {
    var check=document.getElementById('check').checked;

    var hp=Number(document.form.hp.value),
        sp=Number(document.form.sp.value),
        ea=Number(document.form.ea.value),
        ed=Number(document.form.ed.value),
        pa=Number(document.form.pa.value),
        pd=Number(document.form.pd.value);

    var hpSum = 0,spSum=0,eaSum=0,edSum=0,pdSum=0,paSum=0;

    if(check){
        eaSum = ea + 11;
        edSum = ed + 17;
        pdSum = pd + 17;
        paSum = pa + 11;
    } else {
        eaSum = ea - 11;
        edSum = ed - 17;
        pdSum = pd - 17;
        paSum = pa - 11;
    }

    document.form.ea.value=eaSum;
    document.form.ed.value=edSum;
    document.form.pa.value=paSum;
    document.form.pd.value=pdSum;
}

The general issues in your code where:

  • the check local variable missed the var;
  • the other local vars were initialized only if the check variable were true and this lead to the NaN value you report;
  • if you have to check for a condition and his opposite it is preferable the if(condition)/else form on the if(condition)/if(!condition) one;
  • to be picky: you do not return any values in your function, just set some values of dom elements
  • you declare the spSum local variable, set it to 0 and not use it.
  • the hpSum also is declared but not used.

Upvotes: 2

Related Questions