@JacobMarshall0
Posted
You may want to explore the element.eventListener("input", ...)
more, as this allows you to update the card details on the display whilst the user enters their details.
I see you have used it to update the formatting of the cardnumber input, but this could use a little work as it breaks when users remove characters and enter them again. I think this may be down to your if statement if(i % 4 == 0 && i < 16)
and how you handle i
, as when users use backspaces the eventListener i
increments, causing the if statement to incorrectly add spaces, and eventually the entry bypasses the if statement. You could also include maxlength
in the <input>
to limit the number of characters a user may enter.
Other than that issue, you've followed the design well and your site looks good on mobile and desktop. Good job.
Marked as helpful
@munyite001
Posted
@JacobMarshall0...Yea, this was just the first attempt, so I was just trying stuff out to make it work, but I'll improve on them, Thanks for the feedback