required
attribute to require something be entered in a field. Further JS checks can be triggered through element change or loss of focus events, or run the checks on submit before actually submitting the form. JS can enforce nearly any sort of constraints you can possibly think of.
If validating data requires information from the server, the information can be gotten through Ajax requests. If the form submit goes to your server, such checks could wait until submittal. Any client side checks need to be considered as subject to malicious manipulation and any essential checks like escaping data needs to be done securely server side, away from possible user manipulation. If the submit goes directly to Stripe, this wouldn’t apply to you. Presumably Stripe is escaping incoming data for their own protection.
]]>I tried validating the form or checking if any form details is missing via Javascript.
But if the form is left blank and Pay button is pressed then that validation doesnot work. The form is being submitted automatically after the Pay button is pressed without the validation.
Can you please help me on this?
]]>As you can see that the stripe Pay button has its own script like this:
<script src="https://checkout.stripe.com/checkout.js" class="stripe-button active" data-key="" data-panel-label="Pay" data-amount="100000" data-name="new trip" data-currency="USD" data-label="Pay"></script>
<button type="submit" class="stripe-button-el" style="visibility: visible;">
<span style="display: block; min-height: 30px;">Pay</span></button>
How can I prevent default on that? Once it is clicked, the form is automatically submitted. My validation js code does not work. ??
]]>I guess I’m not understanding your setup correctly. Are you not validating the pop-up form content? So the data you want to validate exists before the form? If so, then sure, validate as part of the script doing the Ajax call. Don’t even bother getting the form if validation fails, put up an error message of some sort.
]]>