How to fetch n items of an array at regular intervals using jQuery in PHP?

Question

Suppose I have 2 divs. I have to populate them with first 2 elements of an array. Then auto refresh the divs and they should get auto populated by next 2 items of the array. This should repeat till the end of array. After each element is traversed, auto refresh should stop.

For example, I have 8 elements in my array and 2 divs (mydiv1 and mydiv2). I want that after every second, divs should refresh themselves. First time mydiv1 contains A1 and mydiv2 contains A2, second time mydiv1 = B1, mydiv2=B2....so on 4 times

My xyz.php file

<?php
    //echo rand();
    $questions=array(
                     "A1",
                     "A2",
                     "B1",
                     "B2",
                     "C1",
                     "C2",
                     "D1",
                     "D2"
                     );
    ?>

My index.php file

<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var auto_refresh = setInterval(
function ()
{
$('#mydiv1').load('xyz.php').fadeIn("slow");
}, 1000); // refresh every 1000 milliseconds
});
</script>
</head>
<body>
<div id="mydiv1"> </div>
<div id="mydiv2"> </div>
</body>

Manish · Accepted Answer · 2013-10-18 12:07:43Z

2

Made some changes to Barmar's code in your previous question

<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var counter=0;
var auto_refresh = setInterval(function() {
$.getJSON('xyz.php', function(data) {
    $("#mydiv1").html(data[counter]);
    $("#mydiv2").html(data[counter+1]);
counter+=2;
if (counter > 6) {
        clearInterval(auto_refresh);
    }
    });
}, 1000);
});
</script>
</head>
<body>
<div id="mydiv1"> </div>
<div id="mydiv2"> </div>
</body>


PHP

<?php
$questions=array(
                 "A1",
                 "A2",
                 "B1",
                 "B2",
                 "C1",
                 "C2",
                 "D1",
                 "D2"
                 );

echo json_encode($questions);

?>

edited Oct 18, 2013 at 12:07

answered Oct 18, 2013 at 11:51

Manish

1,4472 gold badges11 silver badges17 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

user1556433 Over a year ago

Thanks, it worked smoothly and as per my requirement.

user1556433 Over a year ago

I doubt one thing in this solution. Where have you imposed boundary condition? If setInterval is called 4 times, then what happens next. Shouldn't we have to use clearInterval somewhere?

Manish Over a year ago

@nkp Check the solution now

user1556433 Over a year ago

Absolutely right. Thanks once again Manish. I will accept your answer.

Collectives™ on Stack Overflow

How to fetch n items of an array at regular intervals using jQuery in PHP?

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related