acidtone/README.md

## README.md

      
    Raw
  

              README.md
            
          
    Spoilers: Adding Machine

This is the "answer" code for Activity: Adding Machine.

  
## index.html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Adding Machine</title>
</head>
<body>
  <form id="adding-machine" action="#something">
    <fieldset>
      <legend>Enter two numbers to add:</legend>
      <div class="wrapper">
        <div>
          <label for="num1">First Number</label>
          <input type="number" name="num1" id="num1" placeholder="Num 1" step=".01" required>
        </div>
        <div>
          <label for="num2">Second Number</label>
          <input type="number" name="num2" id="num2" placeholder="Num 2" step=".01" required>
        </div>
      </div>
      <button type="submit">Add</button>
    </fieldset>
  </form>
  <script>
    // Create a variable for the form
    const form = document.querySelector('form');

    // Add `submit` event listener
    form.addEventListener('submit', function(event){
      // Prevent the form from submitting
      event.preventDefault();

      // Add num1 and num2 and assign it to a result
      const num1 = form.num1.value;
      const num2 = form.num2.value;
      const result = parseFloat(num1) + parseFloat(num2);

      // console.log the result
      console.log(result);
    });


  </script>
</body>
</html>
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Adding Machine</title>
	</head>
	<body>
	<form id="adding-machine" action="#something">
	<fieldset>
	<legend>Enter two numbers to add:</legend>
	<div class="wrapper">
	<div>
	<label for="num1">First Number</label>
	<input type="number" name="num1" id="num1" placeholder="Num 1" step=".01" required>
	</div>
	<div>
	<label for="num2">Second Number</label>
	<input type="number" name="num2" id="num2" placeholder="Num 2" step=".01" required>
	</div>
	</div>
	<button type="submit">Add</button>
	</fieldset>
	</form>
	<script>
	// Create a variable for the form
	const form = document.querySelector('form');

	// Add `submit` event listener
	form.addEventListener('submit', function(event){
	// Prevent the form from submitting
	event.preventDefault();

	// Add num1 and num2 and assign it to a result
	const num1 = form.num1.value;
	const num2 = form.num2.value;
	const result = parseFloat(num1) + parseFloat(num2);

	// console.log the result
	console.log(result);
	});


	</script>
	</body>
	</html>