Код Jquery не запускается внутри асинхронной функции

Я уверен, что делаю что-то не так, это очень просто, но я не могу понять, что.

Цель: я показываю модальное окно загрузки при обработке платежа по карте с полосой. Но если пользователь вводит что-то неправильное, например, срок действия или что-то подобное, я бы хотел, чтобы модальная загрузка закрылась и позволила пользователю решить свою проблему.

Проблема: модальное окно загрузки просто остается открытым на неопределенный срок, когда я говорю ему скрыть модальное окно, оно ничего не делает.

У меня такое чувство, может быть, потому что он вызывает его из асинхронной функции, он не хочет делать то, что ему говорят? Я новичок в Javascript и JQuery, поэтому, если это просто, не могли бы вы объяснить, почему?

Вот способ оплаты картой:

// Submit payment
// Calls stripe.confirmCardPayment
// If the card requires authentication Stripe shows a pop-up modal to
// prompt the user to enter authentication details without leaving your page.
var payWithCard = async function (stripe, card, clientSecret) {
    stripe
        .confirmCardPayment(clientSecret, {
            payment_method: {
                card: card,
                billing_details: {
                    name: billingAddressStuff.strName,
                    address: {
                        line1: billingAddressStuff.strStreet1,
                        line2: billingAddressStuff.strStreet2,
                        postal_code: billingAddressStuff.strZip,
                        state: billingAddressStuff.strStateName,
                    },
                    email: billingAddressStuff.strEmail
                }
            }
        })
        .then(function (result) {
            if (result.error) {
                $("#loadMe").modal("hide");        // This is what is not doing anything when it's called
                // Show error to your customer
                showError(result.error.message);
                return false;
            } else {
                // The payment succeeded! now process the order
                document.getElementById("TheSubmitButton").disabled = true;
                PlaceOrder();
                return true;
            }
        });
};

Вот что вызывает оплата картой:

// On submit, pay with card!
        var form = document.getElementById("payment-form");
        form.addEventListener("submit", function (event) {
            event.preventDefault();

            // Show loader
            $("#loadMe").modal({
                backdrop: "static", //remove ability to close modal with click
                keyboard: false, //remove option to close with keyboard
                show: true //Display loader!
            });

            // Complete payment when the submit button is clicked
            
            // get billing info                 
            billingAddressStuff.strName = document.getElementById("strBillName").value;
            billingAddressStuff.strCompanyName = document.getElementById("strBillCompanyName").value;
            billingAddressStuff.strStreet1 = document.getElementById("strBillAddress").value;
            billingAddressStuff.strStreet2 = document.getElementById("strBillAddress2").value;
            billingAddressStuff.strCity = document.getElementById("strBillCity").value;
            billingAddressStuff.strStateName = document.getElementById("strBillState").value;
            billingAddressStuff.strZip = document.getElementById("strBillZip").value;
            billingAddressStuff.strPhone = document.getElementById("strBillPhone").value;
            billingAddressStuff.strEmail = document.getElementById("strBillingEmail").value;

            // else, save locally
            document.getElementById("TotalsModel").PI.value = data.clientSecret;

            // check stock and prices before charging the card
            var StockIsGood = false;
            var PriceIsGood = false;
            var AllItemsActive = false;

            StockIsGood = CheckStock();
            PriceIsGood = CheckPrice();
            AllItemsActive = CheckActiveItems();

            // if all good, then continue and process the payment at the given price.
            if (StockIsGood && PriceIsGood && AllItemsActive) {

                payWithCard(stripe, card, data.clientSecret);

            }
            else {
                $("#loadMe").modal("hide");
            }
            
        });

Вот что я получаю в результате:

Обновлять: Если вы хотите увидеть проблему самостоятельно, перейдите на сайт test.shop.vents-us.com, используя логин [email protected], пароль: HelloWorld1! Положите все в корзину, идите к полям для кредитных карт и играйте.

Вот модальный HTML:

<!-- Modal -->
    <div class = "modal fade center" id = "loadMe" tabindex = "-1" role = "dialog" aria-labelledby = "loadMeLabel">
        <div class = "modal-dialog modal-dialog-centered modal-sm" role = "document">
            <div class = "modal-content">
                <div class = "modal-body text-center">
                    <div class = "spinner-border" role = "status">
                        <span class = "sr-only">Loading...</span>
                    </div>
                    <strong>Loading...</strong>
                </div>
            </div>
        </div>
    </div>