SetTimeout shows time remaining before reloading div - AJAX

Question

I am making a script to restart the AJAX script 7 seconds after loading it. Is there a way to display a timing chart in setTimeout?

this is my base script:

function update() {
    $.ajax({
        type: 'GET',
        url: 'messageContent.php',
        timeout: 1000,
        success: function (data) {
            $("#chatBox").html(data);
            document.getElementById('messages').scrollTop = document.getElementById('messages').scrollHeight;
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
            var d = document.getElementById("loadcon");
            d.innerHTML = '<div class="loadingAnimation"><h3 class="status">Reconnecting...</h3></div>';
            setTimeout (update, 7000);
        }
   });
}

Answer 1

Try using a function to make a timer and call it on your handler

like this:

 function startCounter(timeLeft) {
      if (timeLeft > 0) {

        ..display timeLeft

       setTimeout (function() {startCounter(timeLeft-1); }, 1000);
       }
      else{

        ..your function to retry

       }
     }

hope that helps :)