Problem with variable scope in javascript

125 views Asked by At

Ok I am definitely puzzled, why this is not returning 6 in textarea. It doesn't return anything. I figured that it has something to do with js scopes, but i cant figure it out.

<body>

    <script language="Javascript">
    var broj = 5;  

    function Inci(){
    var broj++;
    document.frmMain.VrsteHolder.value = broj;
    }

    </script>

    <form name="frmMain" method="get" action="script.php">

    <textarea name="VrsteHolder" rows="4"> </textarea>
    <input type="button" value="Dodaj porudzbinu" name="buttonDodaj" onClick="Inci();"/> 

    </form>

</body>
3

There are 3 answers

3
Jacob Relkin On BEST ANSWER

Get rid of the var keyword inside of the Inci function.

var redeclares variables in the current scope, so it will redeclare broj every invocation of Inci.

This would be the correct way:

var broj = 5;  

function Inci(){
   document.frmMain.VrsteHolder.value = ++broj;
}
1
Cfreak On

because the var keyword defines the variable. Remove var from your function:

function Inci(){
    broj++;
    document.frmMain.VrsteHolder.value = broj;
    }
1
Nick Craver On

The problem is var as the other answers detail, redeclaring your variable, or attempting to rather, and actually throwing a syntax error because of the combination.

As an aside though that I'm seeing less: don't forget you can increment and get the result immediately by having the ++ (increment operator) before the variable, for example:

function Inci(){
  document.frmMain.VrsteHolder.value = ++broj;
}

You can test that version out here.