jquery getJSON handle long wait time

28 views Asked by At

I have some jQuery that is interacting with a script that controls a credit card terminal. It uses getJSON and has a long wait time, because it is waiting for them to interact with the terminal. The response time can be anywhere between 10 seconds and a minute.

The browser freezes up entirely while it is waiting, and eventually a browser error pops up saying the page is unresponsive.

This either didn't use to cause an issue or it wasn't noticed until now. How can I handle this long wait time without locking up the browser and showing an error?

$(".completeOrderAjax").html('Instruct customer to insert or swipe credit card');
    
$.ajaxSetup({ async: true });   
    
$.getJSON( "/payment-api.php", function( data ) {
        if(data.status == 'declined') {

            if(data.resptext == null) { 
                $(".completeOrderAjax").html('Payment declined, customer may have pressed decline button'); 
            }else{ 
                $(".completeOrderAjax").html('Payment Declined: '+data.resptext); 
            }

        }
        if(data.status == 'approved') {
            $(".completeOrderAjax").html('Payment was approved');
                var ccResponse = JSON.stringify(data);
            if(orderId == 0) {
                reSaveOrder('credit', ccResponse);
            }else{
                saveOrder('credit', ccResponse);
            }
        }
    }).fail(function() {
        
        $(".completeOrderAjax").html( "Payment request failed due to unknown error" );

    });
0

There are 0 answers