I’ve been working on customizing the checkout page via checkout.liquid, I’m essentially following the instructions given here:
https://shopify.dev/docs/themes/architecture/layouts/checkout-liquid/customize-checkout#form-submit
My goal is to validate billing address before submission. My code looks like this:
(function($) {
$(document).on("page:load page:change", function() {
if (Shopify.Checkout.step === "payment_method") {
$(".shown-if-js button[type=submit].step__footer__continue-btn").on("click", function(e) {
e.preventDefault();
// here is my validation logic
$("[data-payment-form]").submit();
});
$("[data-payment-form]").on("keyup", function(e) {
if (e.keycode === 13) {
e.preventDefault();
$(".shown-if-js button[type=submit].step__footer__continue-btn").trigger("click");
}
});
}
});
})(Checkout.$);
I’m encountering an issue where, despite successfully selecting the “data-payment-form” using jQuery, I’m getting the following error: “Impossible to verify payment data. Check your card data and retry.” on submit.
Just to provide more context:
- I’m using Shopify Payments as the payment gateway.
Additionally, I’ve attempted to verify abandoned checkouts, but there’s no history information in my order.
If I try to use Nexi it works perfectly, but I need to migrate to shopify payments.
Any insights or suggestions on how to troubleshoot and resolve this issue would be greatly appreciated!