Error with shopify payments with checkout customization

scampagnese
Shopify Partner
1 0 1
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.

image-20230830-075607.png

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!
Replies 0 (0)