Calculate one variable based on changing input

Question

I have the following function:

function updateInput(ish){
    document.getElementById("BetAmount").value = ish;
}

I have the following HTML inputs:

<input class="defaultText" type="number" name="BetAmount" id="BetAmount" onchange="updateInput(this.value)">

<input type="number" name="PotentialGain" id="PotentialGain" />

When users enter in a bet amount number(BetAmount), I would like to instantly show a calculated PotentialGain, which, for example, can be found by multiplying a constant by the specified bet amount entered in by the user.

I'm not very familiar with JavaScript, so any help is greatly appreciated!

Answer 1

Your code is almost correct - you are showing the result in the BetAmount field so no change is visible.

Change your code to:

document.getElementById("PotentialGain").value = ish;

Here's a working demo. I changed the event to onkeyup as onchange only happens on blur - i.e. when a field loses focus.

Answer 2

Here is the final JQuery function that I used.

function changeBet(bet) {
var moneyline = <?php echo json_encode($win) ?>;
var gain = moneyline * bet;
document.getElementById("PotentialGain").value = gain;
}

Along with these inputs:

<input type="text" name="BetAmount[]" id="BetAmount" onkeyup="changeBet(this.value);" >
<input type="number" name="PotentialGain" id="PotentialGain" />