Question

I have Jquery+Ajax page that connects to server gets some data, and displays it. This is done all the time, function calls itself after it completes all task and starts to perform again and again. But If komputer loses internet connection everything stops. And when connections comes back again, nothing happens. Here is javascript code. How can I iprove it so it will continue to work after connection is back again.

$(document).ready(function() {
var a=1;
var max='23';

function kiosk() 
{
    if(a<max) 
    {
        $.post('engine.php', { index: a },
        function(result) 
        {
            result = jQuery.parseJSON(result);

            $('#main').css({'display':'none'});


            $('#div_city').html(result.dest);
            $('#div_price').html(result.price);
            $('#div_price_pre').html('From&nbsp;');
            $('#div_price_after').html('&nbsp;Euro');

                $('#main').fadeIn(2000).delay(3000).fadeOut(2000, function() 
                    {

                            $('#main').hide;
                            a++;
                            kiosk();


                    });

        });
    }
    else
    {
        a=1;
        kiosk();
    }

}
kiosk();
});

Answer 1

I would suggest rather than using $.post you use

$.ajax({ type: “post” , success : function1() , failure: function2() }.

In function2() you can call koisk again after a timeout. and the succces would be the function you have created right now.

This link will help you understand the ajax function jQuery Ajax error handling, show custom exception messages

Eg Code snippet:

function kiosk() 
{
if(a<max) 
{
    $.ajax({type : "POST" , url : 'engine.php',data: { index: a },
    success : function(result) 
    {
        result = jQuery.parseJSON(result);

        $('#main').css({'display':'none'});


        $('#div_city').html(result.dest);
        $('#div_price').html(result.price);
        $('#div_price_pre').html('From&nbsp;');
        $('#div_price_after').html('&nbsp;Euro');

            $('#main').fadeIn(2000).delay(3000).fadeOut(2000, function() 
                {

                        $('#main').hide;
                        a++;
                        kiosk();


                });

    },error : function (xhr, ajaxOptions, thrownError){ setTimeout(200,kiosk())  }

    });
}
else
{
    a=1;
    kiosk();
}

}
kiosk();
});`