Hey Bryan! Right now the “Pay Now” submit form-button can be clicked without having all required fields filled it. I think the issue is I have added an on-click event listener (as per the Square example docs) that runs a handlePaymentMethodSubmission function, which creates a payment token asynchronously, whereas before my Pay Now button would post the form and attempt making the payment token in the same submission.
const formButton = document.getElementById(
'form-button'
);
formButton.addEventListener('click', async function (event) {
await handlePaymentMethodSubmission(event, card);
});
Before using the new Payments API, if I clicked Pay with no fields filled in it would validate the all form fields in order:
After implementing with the event listener code above it only validates the Card payment fields: