Mads Frost
Mads Frost

Reputation: 105

Can't use variable from previous function in new function or syntax?

I'm rather new to Javascript, and I'm trying to calculate the BMR in "Oppgave A" of a male who is 18 years old and 180 centimeters high. The first function of the calculation works. I get the amount of calories this male with a user-defined weight needs each hour.

Problem: When trying to calculate the energy used in sitting at the desk bmr * 1.2, the previous variable bmr i used in the function printBmr from the function turns out is undefined when I call it in the new function printPalStille.

Question: How can I use the variable bmr from the previous function printBmr and use it in the new function *printPalStille *under the new variabel pal?

The Code:

<script>
     // __________________________________________________

    // Oppgave A
    var vekt = document.getElementById("idtxtVekt");
    var svar = document.getElementById("idpSvar");
    vekt.focus();


    vekt.addEventListener("keyup", printBmr);
    function printBmr (event) {
        if (event.keyCode === 13) {
        var kalkuler = 35.27 + (0.558 * vekt.value);
        var bmr = Math.floor(kalkuler);
        svar.innerHTML="Energimengden som kreves hver time for deg er: " + bmr + " kalorier i timen.";
        }


    }

    // __________________________________________________



    // Oppgave B
    var palStille = document.getElementById("idbtnStille");
    var palTur = document.getElementById("idbtnTur");
    var svarPal = document.getElementById("idpsvarPal");
    palStille.addEventListener("click", printPalStille);
    // palTur.addEventListener("click", printPalTur);

    function printPalStille (event) {
        var pal = bmr.value * 1.2;
        svarPal.innerHTML = "Din pal er: " + pal.value;
        console.log(bmr);
        }



     // __________________________________________________
</script>

I am a complete beginner and I'm trying to improve my javascript skills, but sometimes things get too complicated for me to understand within forums and communities, therefore I have problems troubleshooting this from other questions, even though the answer is there, and i apologise for the use of Norwegian phrases and words with-in my code :(

Upvotes: 1

Views: 341

Answers (3)

ThS
ThS

Reputation: 4783

As a short answer for your issue, you can declare the bmr variable as global. Furthermore, your making some mistakes in your code, you wrote pal.value, bmr.value and that's wrong, to get a variable's value you'll only need to call it using its name like: var something = somethingElse * 2.

Here's a working demo for you:

// notice the bmr variable, it's declared as global.
// it's recommended to declare all the variable at the beginning.
var vekt = document.getElementById("idtxtVekt"),
svar = document.getElementById("idpSvar"),
bmr = 0,
palStille = document.getElementById("idbtnStille"),
palTur = document.getElementById("idbtnTur"),
svarPal = document.getElementById("idpsvarPal");

vekt.focus();
vekt.addEventListener("keyup", printBmr);
palStille.addEventListener("click", printPalStille);

// functions
function printBmr (event) {
  if (event.keyCode === 13) {
var kalkuler = 35.27 + (0.558 * vekt.value);
bmr = Math.floor(kalkuler);
svar.textContent = "Energimengden som kreves hver time for deg er: " + bmr + " kalorier i timen.";
  }
}
function printPalStille (event) {
  var pal = bmr * 1.2;
  svarPal.textContent = "Din pal er: " + pal;
  console.log(pal);
}
<div id="boksEn" style="background-color: tomato; color: white; padding: 5px 5px;">
<h1>1. BMR</h1>
<p><b>BMR</b> er Energimengden som kreves for at organene våre skal fungere, og er avhengig av kjønn, alder, høyde og vekt.</p>
<p>Regn ut BMR for gutt 18 år og 180cm høy: </p>
<p>Tast inn vekt i kg: <input type="number" id="idtxtVekt"></p>
<p id="idpSvar">Svar: </p>
</div>
<div id="boksTo">
<h1>2. PAL</h1>
<p><b>PAL</b> er et uttrykk for ulike typer aktivitet, som for eksempel å sitte stille eller å gå en tur.</p>
<p>Velg én aktivitet for å finne ut av energiforbruk: </p>
<button id="idbtnStille">Stille sitting</button>
<button id="idbtnTur">Tur gående</button>
<p id="idpsvarPal">Svar: </p>
</div>

I used textContent attribute instead of the innerHTML one as we're just appending some text and not HTML.

Upvotes: 1

DedaDev
DedaDev

Reputation: 5249

There are many ways, simplest would be to initiate bmr variable above function instead of in a function.

var bmr;
function printBmr (event) {
    if (event.keyCode === 13) {
    var kalkuler = 35.27 + (0.558 * vekt.value);
    bmr = Math.floor(kalkuler);
    svar.innerHTML="Energimengden som kreves hver time for deg er: " + bmr + " kalorier i timen.";
    }
}

now after function is triggered bmr will hold Math.floor(kalkuler) value, and you can access it globaly.

Upvotes: 2

KusokBanana
KusokBanana

Reputation: 345

Please, read about global and local variables in JavaScript

You could:

1) Return this value from another function (wrap this math calc into function and call it directly for variables) [Recommend this]

2) Declare this variable as global (out of all functions)

3) Push it as function parameter

Upvotes: 2

Related Questions