Looking to hire developers?
i used a library call Maska to split credit card number into 4 segments, do you have any better idea to format credit card number input?
@simeydotme
Posted
You could consider setting a "pattern" attribute and "inputmode" attribute on the card number <input> so that it allows easier input on mobile devices :)
Aside from that the thing looks great! Good job! You've followed the design very well and the mobile view looks perfect!
@blockfl0w
Posted
You can store the card number as string and then remove any extra whitespace potentially added by the user by using the replace() function I used this code number.value.replace(/\s/g, '');. Then you can use the slice() function to get the 4 segments of the value e.g. number.value.slice(0, 4); This would get the first 4 numbers. Then repeat this 4 times to get each segment and from there you can do your validation
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
