javascript variable reset button

Question

I am trying to add a button which will change the value of "box1" or "value!" to = 0. I've spent hours trying different approaches, can someone please point me in the right direction.

  <script type="text/javascript">
  
  	function calculate() {
		var value1 = document.getElementById('box1').value;	
		var value2 = document.getElementById('box2').value;
		var result = document.getElementById('result');	
		var myResult = value1 * value2;
		result.value = myResult;
	}
	function reset() {
	 value1 = 0;
	 }
  
  </script>
  
  <div><input id="box1" type="text" /> Value 1</div>
  <div><input id="box2" type="text"  />Value 2</div>
  <div><input id="result" />Answer</div>
  <div><button onclick="calculate()" value="text here" style="width: 139px">Calculate</button></div>
  <div><button onclick="reset()" value="text here5" style="width: 139px">reset</button></div>

As far as I know JavaScript(very little) value1 = 0 does not exist in the scope of reset() You must declare it and the initialize. — Yoda
– Yoda, Commented Apr 19, 2015 at 20:51

uraimo · Accepted Answer · 2015-04-19 20:51:59Z

1

If you want to reset all the fields, following your style:

function reset() {
   document.getElementById('box1').value=0; 
   document.getElementById('box2').value=0;
   document.getElementById('result').value=0;   
}

Or, if you want to reuse those variables declaring them as global:

<script type="text/javascript">

var el1;
var el2;
var res;

function calculate() {
    el1 = document.getElementById('box1');  
    el2 = document.getElementById('box2');
    res = document.getElementById('result');    
    var myResult = el1.value * el2.value;
    res.value = myResult;
}
function reset() {
    el1.value = 0;
    el2.value = 0;
    res.value = 0;
}

</script>

answered Apr 19, 2015 at 20:51

uraimo

20k8 gold badges50 silver badges57 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

MaxZoom · Accepted Answer · 2015-04-19 20:58:03Z

It works fine for me ;)

function calculate() {
  var value1 = document.getElementById('box1').value;
  var value2 = document.getElementById('box2').value;
  var result = document.getElementById('result');
  var myResult = value1 * value2;
  result.value = myResult;
}

function reset() {
  document.getElementById('box1').value = 0;
  document.getElementById('box2').value = 0;
  document.getElementById('result').value = 0;
}

<div>
      <input id="box1" type="text" />Value 1</div>
    <div>
      <input id="box2" type="text" />Value 2</div>
    <div>
      <input id="result" type="text" />Answer</div>
    <div>
      <button onclick="calculate()" value="text here" style="width: 139px">Calculate</button>
    </div>
    <div>
      <button onclick="reset()" value="text here5" style="width: 139px">reset</button>
    </div>

DRAB · Accepted Answer · 2015-04-19 20:53:25Z

0

Your variable value1 does not exist in the scope of your reset method. It is defined in calculate.

You should refer to the box you wish to reset in your reset function:

document.getElementById('box1').value = 0;

answered Apr 19, 2015 at 20:53

DRAB

4452 silver badges10 bronze badges

Collectives™ on Stack Overflow

javascript variable reset button

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related