Event handling web fundamentals web ticketing JS final step

Question

Hi guys,

I need help to make the final step of the code repo even handling web ticketing really works when writing a number into the input fields of adults and children (I'm new in this), to take the values and perform the calculation. The description is:

Event Handling

Time to finalize our price calculation and add the functionality to our form!

Tasks:
1. Add the window.onload event handler.
2. Inside it, take the reference to the buy button (assign it an id, so you can take its reference).
3. Handle the click event of the buy button: inside the handler, take the references of the adults and children text fields using their ids.
4. Calculate the total price of the tickets using the calc() function.
5. Output the price to the screen using the alert() function.

Hint: Take the current value using the .value property: here is how your window.onload event handler should look like:
window.onload = function() {
let btn = document.getElementById("buyBtn");
btn.onclick = function() {
let adults = document.getElementById("adults").value;
let children = document.getElementById("children").value;
let price = calc(adults, children);
alert(price);
}
}

Here is my code https://www.sololearn.com/compiler-playground/WKj9jk7tG5Gj/

/* Creating variables */

let adults = parseInt(document.getElementById("adults").value);
let children = parseInt(document.getElementById("children").value);
let price = (adults * 12) + (children * 5);
/*console.log(price);*/

/* Reviewing if the input on aduls and children, is a negative
number, if it is, will be changed to 0 */

if (adults < 0) {

adults = 0;

}

if (children < 0) {

children = 0;

}

/* Crating a program to print the tickets, for the adults */

for(let i = 1; i <= adults; i++) {
console.log("Ticket #" + i);
}

/* Creating a function to replace the price calculation */

/*let adults = document.getElementById("adults");
let children = document.getElementById("children");*/

Answer 1

The comments are a great idea and it's good practise for professional codes. Your thought about reviewing later is completely correct! I only removed them because you have yours and I wanted you to see what the difference was more easily.

I'm not an expert or even so good yet. My advice is simply keep at it! Read what you can, create your own codes to practise. Each time you do something wrong, try to solve it, look for answers here and elsewhere online.
This forum is a great resource and many of the users are experts, so if you need help, don't be afraid to ask.

Answer 2

Hi Luzardo, I changed a few things and removed some comments to make it easier to read.

Is this how you want it?

https://code.sololearn.com/Wc1q44WQuu1o/?ref=app

Answer 3

My pleasure that I could help

Answer 4

Hi @Ausgrindtube,

Big thank you for your help, yes, that was what I wanted to perform in the input fields of adults and children. You fix it, thank you.

Sorry for all the comments in the code, I'm learning and thought that way would help to guide me when reviewing the codes later.

I'll appreciate it if you could give me some tips/best practices, I'm open to learning.

Answer 5

Thank you @Ausgrindtube