Pricing component Sass/Flexbox

Community feedback

• 

  Elizabeth•460

  @gelizabethPosted over 3 years ago

  Hi Matthew, Great work with HTML and CSS!

  For javascript - I've seen your code, here are some suggestions:

  1.Select element, not its property because element can emit events. let checkBox = document.querySelector('#myonoffswitch');

  2. Input, in this case checkbox, has special event - change when element is checked/unchecked. checkBox.addEventListener('change', myFunction());

  3. In myFunction check checkbox.checked and change innerHTML of elements. function myFunction(){ if(checkbox.checked) { //change prices to year} else {//change prices to month} }

  Hope this helps, If you have more questions I'll try to answer. Happy coding!

  1

  ---

  

  Matthew Van Pelt•575

  @Mattvp21Posted over 3 years ago

  Youre solution worked! :D

  Thanks for saving me alot of time!

  Just a quick question: Why use the change event in this case instead of checking the boolean?

  Thanks again,

  Matt

  0

  

  Elizabeth•460

  @gelizabethPosted over 3 years ago

  @Mattvp21 you are welcome:)

  If you check Boolean it will call your myFunction only once - when page is loaded, so you will not see any change; and you need to call it every time you click year/month switch.

  1

  

  Matthew Van Pelt•575

  @Mattvp21Posted over 3 years ago

  @gelizabeth So I guess that would explain why checking the condition in the console worked but not in the code. Got it!

  0