All comments

• 

  Tegar Setyo Wicaksono•50

  @Tegarsetyo6Submitted over 2 years ago

  I still don't understand how to create the correction feature to stop form from submitting and show warning when form input is not appropriate

  

  Interactive Card Details Form With HTML,CSS,JS,JQuery

  1

  40
  

  Simon Goellner•40

  @simeydotmePosted over 2 years ago

  To prevent the form from submitting if Validation is not passed, you may use an onsubmit event on the <form> element ( <form onsubmit='checkValidation'>) instead of using a onclick event on the <button>... then you can check if the form has not passed validation. You can return false or event.preventDefault inside of the checkValidation event handler to stop the form from submitting on error.

  More information can be found on mozdev; https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormElement/submit_event#javascript

  Hope that is helpful!

  Marked as helpful

  0

  This comment has received 1 replyShow
• 

  CharmaineHYM•20

  @CharmaineHYMSubmitted over 2 years ago

  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?

  

  Charmaine Credit Card Detail

  2

  41
  

  Simon Goellner•40

  @simeydotmePosted over 2 years ago

  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!

  0