Skip to content
Submitted about 3 years ago

Tip Calculator App Vanilla JS

Rod•260
@bague-rodnel
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Tip calculator app
  • HTML
  • CSS
  • JS
2junior

Design comparison

SolutionDesign

Solution retrospective

Ok. I am getting OCD from that reset button always re-enabling after inputs lose focus. I decided I'll just let it slip since it doesn't break functionality. Please share some thoughts on how to deal with that or if there is a better approach.

I am defaulting the Number of People to 1 on resets and app init. I could have gone for a default of 5% tip as well.

Community feedback

  • Joshua Clement•40
    @JaclemPosted about 3 years ago

    You can use document.getElementById('input', () => {}) to make it so that the when you input a number it automatically updates the tip and total without having to click off of the items. Took me a while to find that one and you didn't add it to your note but I thought it would be helpful

    Marked as helpful
    1

Please log in to post a comment

Log in with GitHub

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