Tip Calculator using Vanilla JS
Solution retrospective
How did everyone deal with several inputs leading to one solution without a submit button? I found it difficult to ensure that the solution didn't calculate or render until all of the inputs were complete.
I also felt like my code was very repetitive. Whats you're favorite method of refactoring to make your code DRY?
Please log in to post a comment
Log in with GitHubCommunity feedback
- @emjogale
Hi Sara, well done on your project - the layout looks great! Regarding your question about several inputs leading to one solution without a submit button - the way I tackled this problem was by just attaching event listeners to each of the tip amount buttons - then you only need one function to calculate the sum. This function would get the value of the button clicked and at the same time what the value of the bill and number of people inputs are. This eliminates the need for attaching an event listener to the other buttons and also means that no calculations can be made before the other inputs have been filled in. Also regarding your html - I'm sure you have read the report - but do note that you can't give more than one element the same id - you have already given your buttons the class of "per-btn" so there is no need for you to give them this as an id as well. I hope this is of help!
Join our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord