Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Credit card form component

Cesar D. 400

@ThatDevDiaz

Desktop design screenshot for the Interactive card details form coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


Another challenge completed utilizing vanilla JS. My focus here was functionality and ensuring the javascript was working as expected. I got a little bit more practice with tailwind but i'm struggling to make the design responsive on smaller displays. This will be my next focus point.

Thanks in advance for any feedback !

Community feedback

Jesus 410

@jesusleonel10

Posted

Hello

Check the functions that are in charge of displaying the text of the inputs, in the cards.

One way to do it would be:

  • Select each input (array)
  • Select each element of the card (array)
  • With the event 'input' (which is executed every time there is a change) you show the same value of the input, in the previously selected card.

This is how you display the input text on the cards in real time.

Information on how the input event works 🔽🔽🔽🔽 https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event

0

Please log in to post a comment

Log in with GitHub
Discord logo

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