Build a Cash Register Project - Build a Cash Register

JavaScript
1

Tell us what’s happening:

Describe your issue in detail here.
I need help setting the text content of the change due element as well as how to have multiple conditions in my if statements.

Your code so far

let price = 1.87;
let cid = [
[“PENNY”, 1.01],
[“NICKEL”, 2.05],
[“DIME”, 3.1],
[“QUARTER”, 4.25],
[“ONE”, 90],
[“FIVE”, 55],
[“TEN”, 20],
[“TWENTY”, 60],
[“ONE HUNDRED”, 100]
];

const input = document.getElementById(“cash”);
const div = document.getElementById(“change-due”);
const button = document.getElementById(“purchase-btn”);
const changeDue = document.getElementById(“change-due”);

button.addEventListener(‘click’, () => {
if(cash.value < price) {
alert(“Customer does not have enough money to purchase the item”);
}
if (cash.value = price) {
changeDue.innerHTML = “No change due - customer paid with exact cash”
}
if (price = “19.5” && cash.value === 20 && cid === [[“PENNY”, 1.01], [“NICKEL”, 2.05], [“DIME”, 3.1], [“QUARTER”, 4.25], [“ONE”, 90], [“FIVE”, 55], [“TEN”, 20], [“TWENTY”, 60], [“ONE HUNDRED”, 100]]) {
changeDue.textContent = “Status: OPEN QUARTER: $0.5”;
}
})

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
  <head>
    <link rel="stylesheet" href="styles.css">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=devce-width, initial-scale=1.0">
  </head>
  <body>
    <main>
      <h1>Cash Register Project</h1>
      <label for="input">Enter cash from customer:</label>
      <input id="cash">
      <button id="purchase-btn">Purchase</button>
      <div id="change-due"></div>
    </main>
    <script src="script.js"></script>
  </body>
</html>

/* file: styles.css */
* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

body {
  background-color: red;
}

h1 {
  text-align: center;
  color: white;
  margin-top: 20px;
  margin-bottom: 10px;
}

main {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

label {
  color: white;
  margin-bottom: 5px;
}

button {
  background-color: yellow;
  padding: 2px;
  margin-top: 5px;
}

/* file: script.js */
let price = 1.87;
let cid = [
  ["PENNY", 1.01],
  ["NICKEL", 2.05],
  ["DIME", 3.1],
  ["QUARTER", 4.25],
  ["ONE", 90],
  ["FIVE", 55],
  ["TEN", 20],
  ["TWENTY", 60],
  ["ONE HUNDRED", 100]
];


const input = document.getElementById("cash");
const div = document.getElementById("change-due");
const button = document.getElementById("purchase-btn");
const changeDue = document.getElementById("change-due");

button.addEventListener('click', () => {
  if(cash.value < price) {
    alert("Customer does not have enough money to purchase the item");
  } 
  if (cash.value = price) {
    changeDue.innerHTML = "No change due - customer paid with exact cash"
  }
  if (price = "19.5" && cash.value === 20 && cid === [["PENNY", 1.01], ["NICKEL", 2.05], ["DIME", 3.1], ["QUARTER", 4.25], ["ONE", 90], ["FIVE", 55], ["TEN", 20], ["TWENTY", 60], ["ONE HUNDRED", 100]]) {
    changeDue.textContent = "Status: OPEN QUARTER: $0.5";
  }
})

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/111.0.0.0 Safari/537.36 Edg/111.0.1661.62

Challenge Information:

Build a Cash Register Project - Build a Cash Register

2

You appear to have created this post without editing the template. Please edit your post to Tell us what’s happening in your own words.

3

this is not going to work

  1. you are hardcoding, instead of building a function that can make it work for any input value
  2. your comparisons aren’t going to work in JavaScript
4

So you’re saying I should create a function for this instead of an addEventListener. Do I need any if statements?

5

an addEventListener gets a function as a callback anyway, that’s not the point
you should have a project that works for the specified inputs, but you should not mention them in your code

you are building the project, what do you think is the answer?

6

I’m still a little confused. I just wonder if I need if and else clauses at all. If I don’t mention the specified inputs, in the code, then what do I write in the code? Do you either have any tips on how to do this, or have some resources you can refer me to?

7

If I create a function, what should it be called? And what should the parameter(s) be?

8

that depends on how you want to implement it, the tests will check clicking the button.

If you have so many difficulties with creating an algorithm, maybe you can try the Legacy JavaScript course

9

Thank you for all your help. I think I will switch to the Legacy JavaScript course

10

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.