I have a form that have onsubmit = "return function()"

<form onsubmit="return checkCartExistingInHolding()" action="..." method="post">
    @csrf
    <button id="payment"  disabled>پرداخت</button>
</form>

and the ajax method is :

function checkCartExistingInHolding(){
console.log('in func');
var isComplete = $.ajax({
    url: "/cart/checkCartExistInHolding",
    method: "get",
    async: false,
    success: function (response) {
        if(response === true){
            console.log('is true');
            return true;
        }else{
            console.log('is false');
            $('tbody[role="cartlist"]').html("");
            $('tbody[role="cartlist"]').html(response);
            // empty_cart_viewport();
            traverse(document.body);
            setEventListeners();
            return false
        }
    },
});
return isComplete;
}

But the form don't get the false response from ajax and don't prevent from submission. also In false ajax don't change the viewport items. where I did go wrong?

CodePudding user response：

I suggest that, instead of using the onsubmit event, make your button call your Ajax function directly. And only on success submit your form with: document.getElementById('myForm').submit()