Javascript Countdown Timer Repeat and execute php code

Question

i have javascript countdown timer from 30 -> 0.

var count = 30;

var counter = setInterval(timer, 1000);

function timer() {
  count = count - 1;
  if (count <= 0) {
    clearInterval(counter);
    return;
  }

  document.getElementById("timer").innerHTML = count;
}

and html:

<span id="timer">30</span>

I want the countdown to repeat automatically when it is over (after 30 secs) and execute php code (Select and show data from mysql)

Answer 1

At the end of your countdown.. Check for if (count <= 0) -- If it does, run your AJAX call to a file -- say --- file.php which contains your php and sql . Also in the if you are going to reset your counter back to 30.

<html>
<head>

</head>
<body>
<span id="timer">30</span>
<div id="#ajax-results"></div>

<script
        src="https://code.jquery.com/jquery-3.4.1.min.js"
        integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
        crossorigin="anonymous"></script>

<script>
    var count=30;

    var counter=setInterval(timer, 1000);

    function timer()
    {
        count=count-1;
        if (count <= 0)
        {
            count=30;
            $.ajax({
                url: 'file.php',
                type: 'POST',
                data: 'somevariable=whatever',
                success: function(data) {
                    //called when successful
                    $('#ajax-results').html(data);
                }
            });
        }

        document.getElementById("timer").innerHTML=count;

    }
</script>
</body>

</html>

Javascript Countdown Timer Repeat and execute php code

Question

1 answers

solution1
0 ACCPTED 2019-09-26 22:24:59

Javascript Countdown Timer Repeat and execute php code

Question

1 answers

solution1 0 ACCPTED 2019-09-26 22:24:59

solution1
0 ACCPTED 2019-09-26 22:24:59